Post Bank

If you have an idea that you genuinely think is good, don't let some idiot talk you out of it.

画像の拡大・縮小を実装する【Swift 4】

UIImageViewに画像を置いただけだと、画面をピンチアウトした時に画像を拡大することができない。
そこで少し調べたら、UIScrollViewを使えばいけるらしいということでこちらの記事を参考にして実装してみた。

f:id:john_kaz:20190226230302p:plain

ScrollViewの中にImageViewを入れて、ScrollViewのContent Modeをcenterにして、実装をコピペして、とやってみた。ちなみにContent Modeはstoryboardから編集できる。

f:id:john_kaz:20190226230128p:plain

ところがうまくいかない。
viewForZoomingInScrollView(scrollView:)じゃなくてviewForZooming(in:)に実装し直したらうまくいった。
Appleの公式ドキュメントにもviewForZoomingInScrollView(scrollView:)なんて書いてない。これは昔のfuncで、もうなくなったのかな?

実装する場合は気をつけて。

参考

Fluid Interfaceとは

Fluid InterfaceとはAppleが提唱する「流れるような操作性」をもつInterfaceのこと。

よく例としてあげられるのが、iPhone Xから採用されたアプリを閉じる時の操作。iPhone Xからはホームボタンがなくなって、アプリを終了させる時には画面下から上にスワイプする。ユーザーはスワイプの途中で気が変わってやっぱりアプリを閉じたくないと思えば、そのまま下に指を戻すとアプリが終了せずに元に戻る。

こういったユーザーの気の移り変わりに即座に対応できるInterfaceがFluid Interface。ホームボタンを押したらホーム画面に遷移するまでの一瞬ユーザーがデバイスの応答を待つといった従来のInterfaceとは異なる。Fluid Interfaceでは二つの状態間の状態までデザインしなければならなくなった。

このFluid Interfaceは「身体の拡張・思考の拡張」という思想から来ている。デバイスを操作しているという感覚ではなく、デバイスまでが体の一部であると感じさせる(というか感じさせない)Interfaceが理想形のようだ。

f:id:john_kaz:20190226004904p:plain
「周」自分の肉体以外のものをオーラで纏う技術。

機械と人間が融け合う日が来るのだろうか。

【新版】UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインとUX

【新版】UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインとUX

  • 作者: 安藤剛,水野勝仁,萩原俊矢,ドミニク・チェン,菅俊一,鹿野護,有馬トモユキ,渡邊恵太,須齋佑紀/津?将氏,庄野祐輔,藤田夏海,塚田有那,増川草介??栂木一徳
  • 出版社/メーカー: ビー・エヌ・エヌ新社
  • 発売日: 2018/10/19
  • メディア: 単行本
  • この商品を含むブログを見る

React Hooksを使ってみようとした話

React Hooks使ってみようとした時に依存関係のエラーが出たのでそのメモ。


とりあえず、create-react-appでReactアプリを作成する。

npx create-react-app test
cd test


で、reactとreact-domの最新版(16.8.0-alpha.1)をインストール。

npm install --save react@next react-dom@next


インストールが終わったら、ローカルのパッケージのバージョンを確認してみる。

npm list --depth=0


そうすると、以下の依存関係のエラーが出てる。

npm ERR! peer dep missing: react@^16.0.0, required by react-dom@16.8.0-alpha.1


react-domはなんでこんなに古いreactのバージョンを要求するんだろう。というかこういう解釈で合ってる?React Hooksのサンプルコード動くからこの問題はこのままでいいのかな?誰か知っていたら教えてください。


追記(2019.2.9)
React 16.8リリースされましたね。
もう一回このコマンド入れると、16.8.1がインストールされて依存関係も解決しました。

npm install --save react@next react-dom@next

ロジカルに話したい

最近社内で私の信用度が徐々に落ちてきているのを肌で感じている。というのも、社内会議で私の言うことがあまり通らなくなってきた。そうなってくると、あー仕事つまんね、転職しようかな、いっそもう誰もいない無人島で原始的な生活を送りたい、そこで誰にも看取られずに浜辺で死にたいなどどいう安易な気持ちが脳裏をよぎるようになる。

やはり自分のやること、為すことすべてが否定されると人間つらくなってくる。何としてもこの状況を早く脱却したい。そこでどうしてこうなったのか原因を考えてみることにした。すると一瞬で答えは出た。

ロジカルに話せていない。私の話には根拠がない。私の話は長い。私の話はつまらない。私の話は結局何が言いたいのかわからない。このままではやばい。今の会社を解雇されて、路頭に迷うことになる。転職しようにも面接で日本語を話せない日本人を雇う企業がどこにあるだろうか。よし直そう。

いろいろと調べてこれならできそうと思ったものはこれ。
1. 結論から話す!
2. 根拠を3つ用意する!
3. 頑張ったことは話さない!

まず結論から話すということ。まぁこれはどこでもよく聞く常識のようなものだけど、意外とできていなかったなぁと反省。普通に日本語話しているとオチは最後なんだよなぁ。オチは最初に持ってくる!合言葉は、「俺は最初からクライマックスだぜ!

次に根拠を3つ用意すること。「3」という数字には魔力が込められているらしい。簡単にいうと3つくらい根拠があれば、人は納得しやすいということ。

最後に頑張ったことは話さないということ。これは結構やっちゃいがちだなぁと思った。頑張ったこと話したくなっちゃうんだよね。神様は見てくれてるから会議の場では我慢しようね?約束だよ?

ということで、上の3つをまずは実践していきたいと思う。地に落ちた信頼を取り戻すことはできるのか!乞うご期待です。

追記(2019.1.28)
根拠を否定されるというどうしようもないパターンを検出。根拠の裏付けはしっかり、ね。

現代版文章読本

この誰でもできるwebで読みやすい文章を書くための4つのポイントがすごいわかりやすい。理解したからといって、実践するのは意外と難しいわけで。意識して少しずつ文章の書き方を改善したい。

リンクを踏むのがめんどくさい人向けに目次だけ上のリンクから抜粋すると、
1. 文章は話すように流れるように書く
2. ブログやエッセイの文章は常に小説でいう「」だと意識する
3. 語尾を散らす
4. 1000文字ではなく、250文字x4など分割する

ちなみに上のリンクのサービスscraiv、文章版YouTubeを目指しているそう。今注目されている個人開発のサイト。面白そうだから登録してみよ。

Django + Reactで初めてのSPAを作ってみた

Django + Reactで作家の人気投票ができるSPAを作ってみました。タイムラインでもなんでもないのに、Book Timelineという名前です。

f:id:john_kaz:20190116224357p:plain

前々から見た目部分いじれるの楽しいやん、かっこいいサイトとかアプリ作ったら女の子に自慢できるやんと思ってWebデザインとかフロントサイドの技術に興味があって、そんな時にジャバザハットリさんテックブックランクとかホットチリレビューズとかに出会って、モテる上に稼げるとか最高かよと思ってReactの勉強がてら何か作ることにしたのでした。そういう経緯で最初に作ったのが、このBook Timelineというわけです。Reduxは少し触ってみて難しいと感じたので、使ってません。

軽くこのサイトの説明を。
このサイトは自分の好きな作家さんを「作家の登録」画面から登録することができて、それぞれの作家さんのページからスターをつけられるというものです。このスター数が多い順にグラフに表示されるようになります。登録できる人物は職業が作家、小説家、詩人の方だけです。(時々それらの職業の方々も登録できないことがあります。。。その時はお問い合わせページからご一報ください。)いたってシンプル!

f:id:john_kaz:20190117081703p:plain

一応本を読むのが好きなので、こんなサイトを作ってみました。あんまり作家さんの方に焦点を当てたサイトってないなーと思って作家さん中心というコンセプトにしたのでした。若干スクレイピングの精度が低いなーと自分でも反省しておりますが、少しずつ修正していければと思っております。このサイトを通してSPAを感じていただければ幸いです。そしてあわよくば何かしらの反応いただけたら嬉しいです。たとえそれが心無い罵詈雑言であっても受け止める覚悟でおります。

Book Timelineよろしくお願いします。

暇なときにみておきたいサイトまとめ

エンジニア、スタートアップ界隈のことを知るのに眺めておきたいサイトを自分用にまとめる。普通にみんな知ってるサイトばかりだと思う。

技術・デザイン系

  • Qiita
    言わずと知れた技術情報共有サービス。SEOが強いからか、技術情報を検索すると大体上位にいる。自分が書いたクソ記事も上位に来ちゃうためなんか申し訳ない気持ちになる。

  • はてなブックマーク テクノロジー
    こちらも言わずと知れたエンジニア御用達のページ。人気記事が表示される。いつかここに載ってみたいと密かに思っている。

  • HEARTBEAT
    英語のブログ。iOSとかAndroidでの機械学習実装に関する記事がたくさんある。少しニッチだけど、結構参考になる。Mediumはデザインがカッコよくて、読みやすいので好き。

  • Create with AI
    アート系のAI技術について紹介するサイト。詳細なアルゴリズムを知るには原論文とか元ブログをたどる必要があるけど、概要がまとまっててわかりやすい。取り上げられる記事のチョイスがいい。

  • 人工知能に関する断想録
    ある特定の技術とか論文に対してかなり詳細に解説してくれている。コード載ってるし、図もわかりやすい。記事から滲み出る筆者の頭の良さたるや...

  • Hacker Noon
    英語の技術記事が集まってるブログ。正直そんなに見ないけど、読めば英語と技術を一緒に勉強できて一石二鳥じゃん、と思いながらやっぱり読まない。

  • UX MILK
    UXについての翻訳記事が集まってるサイト。UXについて語るサイトだけあって、UXが素晴らしい。UX MILKのアプリもある。

  • Webクリエイターボックス
    デザインを勉強するのにちょくちょく読んでる。フォントとかCSSとか紹介されてて面白い。

スタートアップ・メディア系

  • TechCrunch
    言わずと知れたスタートアップメディア。スタートアップに転職するまで実は知らなかったのは秘密。

  • THE BRIDGE
    言わずと知れたスタートアップメディア。特に言うことはない。

  • WIRED
    科学系の記事がおしゃれに紹介されてる。特に言うことはない。

  • TED
    英語のプレゼンがたくさん載っている。これでリスニング学習するもよし、プレゼンの参考にするもよし、普通にプレゼンを楽しむもよし。このプレゼンが好き。