2017年のウェブデザイン・フロントエンド界隈の人気のツイートまとめ

今年一年の私のTwitterで人気を集めたツイートを紹介します。1万3千RTを超えるなど、今年はクリエイティブ系のツイートに注目が集まりました。

デザイン関連

今年一番注目されたツイートは、Adobe MAX JAPANのレポート。記事「テンの貂明朝フォントが誕生！鳥獣戯画の動物の明朝体で書体マニア狂喜乱舞？アドビシステムズの自信作！」では、「フォントマニア」として私が紹介されていました（笑

速報。Adobe、新しいフォント 「貂明朝」を発表。 #MAXJAPAN pic.twitter.com/g8fli4uFm7

— 池田 泰延 (@clockmaker) 2017年11月28日

今年の4月のフォントの日制定イベントに招待をうけ参加したのですが、字体の特徴を紹介したレポートツイートも伸びました。

源ノ明朝の特徴。このフォントの特徴は覚えておきたい！
・小塚明朝に比べて、横線は太く
・漢字は懐を閉めている#フォントの日 pic.twitter.com/8glLV1aoP2

— 池田 泰延 (@clockmaker) 2017年4月10日

フロントエンド界隈

Reactライセンス騒動の決着を報告。Reactユーザーの一代表としてツイート。

Reactユーザー歓喜。

特許条項付きBSDライセンスから、MITライセンスに変更すると、公式から発表がありました。 https://t.co/jPWWzUr141

— 池田 泰延 (@clockmaker) 2017年9月23日

また、いわゆるjQueryオワコンについて皮肉を込めコメント。

ここは特に同意
↓
jQueryをオワコンと言ってるのは(略)ごく一部の「酔狂な人々」であり、彼らの多くは件のwebサイト制作のことは一切視野に入れていないhttps://t.co/ZcaA0w9Dou

— 池田 泰延 (@clockmaker) 2017年5月30日

ES Modulesが最もシェアのあるブラウザに搭載されたことをツイート。

今日リリースされたChrome 61からECMAScript 2015のimport/export文がサポートされました。

これは今後のJavaScript開発を大きく変化させるパラダイムとなるでしょう。

簡単にですが、使い方を図版にまとめました。 pic.twitter.com/pNmrHZ1yJT

— 池田 泰延 (@clockmaker) 2017年9月6日

HTML5 Conferenceのレポートツイート。おそらくツイートの意図を間違えて解釈してRTした人もいるかも。。(ツイートの内容は間違っていないですが)

HTML5終了の提案のお知らせ。「実際HTML5終了しそう」とのことで興味深い。#html5j #html5j_h pic.twitter.com/CODdScljxO

— 池田 泰延 (@clockmaker) 2017年9月24日

みんな大好きなエディターの開発傾向の比較。今後のエディター選びの参考に。

オープンソース系エディターのコミット頻度の比較（2016年1月版）。

①MS – Visual Studio Code
②GitHub – Atom
③Adobe – Brackets

AtomもBracketsも開発が終息しつつあるのに、VSCodeは今も全力すぎる…。 pic.twitter.com/CErjFUK1Kc

— 池田 泰延 (@clockmaker) 2017年1月31日

クリエイティブ関連

仕事がら、Photoshopを起動しない日はありません。大好きなPhotoshopを最適化したくて調べたことをツイートしたら伸びました。870RT。

Photoshop CC 2017の起動を速くする方法。 pic.twitter.com/FzinkINGNG

— 池田 泰延 (@clockmaker) 2017年7月22日

弊社の @a24 の記事を紹介したツイート。

動きにちょっと工夫を入れるだけ。
アニメーションをいい感じに魅せる手法。

・横移動に、回転の動作を加える
・落ちて跳ねるときに、伸縮の動作を加える
・拡大時に、垂直と水平のタイミングをずらす

詳しくは → https://t.co/gSdoI4qWoK pic.twitter.com/xTo8pA0DKK

— 池田 泰延 (@clockmaker) 2017年1月18日

今年話題になった映画「夜は短し歩けよ乙女」の制作ワークフローにFlashが使われていたとのこと。残業ゼロにFlashが役立っているとのこと。

すごい、FlashがNHKで取り上げられてる･･･!!

世界も評価！ アニメ制作の“新手法”｜NHK NEWS WEB https://t.co/1c2q7EROsv

— 池田 泰延 (@clockmaker) 2017年6月28日

そんなFlashの今後について。PV集めのためにブログメディアが「Flash終了w」と報道してましたが、牽制の目的でツイート。約2300RT。

「Flash」と一言で報道するのは端折りすぎ。Flashテクノロジーのうち、ブラウザプラグインの「Flash Player」が終了予定となっただけです。

・Flash Player→2020年末に終了へ
・Adobe AIR→継続
・Adobe Animate CC→継続

— 池田 泰延 (@clockmaker) 2017年7月26日

写真関係

趣味の写真関係のツイートも注目を集めました。今年発売されたSONYのカメラのツイート。3500RT。

SONY α7RⅢの目玉機能「ピクセルシフトマルチ撮影」がやばい。

1億6960万画素分のデータなので解像力・ダイナミックレンジが桁外れ。夜景を撮影したのですが、建築物が隅々まで解像している。

等倍で見てください。ぶったまげますよ！https://t.co/ipY4nf5bmm#α7RIII #α7R3 #a7R3 #alpha7R3 pic.twitter.com/hyWsYry98X

— 池田 泰延 (@clockmaker) 2017年12月1日

このカメラは解像力がすごい。マクロ撮影をすると顕微鏡のように映ります。

1億6960万画素分のSONY α7RⅢのピクセルシフトを使って、iPhone Xをマクロ撮影してみたら凄かった…。

高密度(458dpi)のSuper Retinaディスプレイのドットの並び方がわかるレベル。

等倍写真はFlickrで公開してます👉 https://t.co/uQvxyTkEsj (27MB)#α7RIII #α7R3 pic.twitter.com/W3ZeXrNGYF

— 池田 泰延 (@clockmaker) 2017年12月19日

iPhoneの深度マップのネタも。Photoshopを愛しているからこそ発見したテクニックですね。900RT。

Photoshop CC 2018ではiOS 11のポートレート写真(HEICファイル)を読み込めます。

面白いのはこのファイルには深度マップ(奥行き情報)が含まれること。

深度マップを使えば、Photoshopでボケを制御し放題。使い方をまとめました。 pic.twitter.com/9mQxa1Tz6B

— 池田 泰延 (@clockmaker) 2017年10月24日

ブラウザ関係

職業がら、普段使うツールのちょっとした変化にも敏感でした。カラーマネージメントは大事ですよね。

Chrome 61にアップデートしたらウェブの色(画像ではなくCSSカラー)が変わり違和感が。

具体的にはmacOSでChrome 60まではFirefoxと同じ鮮やかな色で、Chrome 61からはSafariと同じ彩度の低い色に。

sRGBに限定されたのかしら？ pic.twitter.com/uTkfkXJd6m

— 池田 泰延 (@clockmaker) 2017年9月6日

ウェブ制作者には影響の大きい出来事。

今年10月リリースのChrome 62から、非SSLのウェブページではinputタグは警告が表示されるようになる、とGoogleからアラートがきました。

type="passward"はともかくとして、type="text"も警告となるのは影響が大きいはず！ pic.twitter.com/CwKZAMWZmF

— 池田 泰延 (@clockmaker) 2017年8月18日

UIデザイナーの視点として、AMPの問題点を列挙。

Google検索からたどったAMPページの問題点をまとめました。

①URLが正規のものではない
②ヘッダーをクリックしてもページトップにスクロールしない
③スクロールの速度が標準と異なる
④ページ内検索ができない
⑤訪問済みリンクにならない pic.twitter.com/mIYjoPGx1x

— 池田 泰延 (@clockmaker) 2017年1月16日

最後に

普段Twitterばかりしているわけではないですよ！ それでは、良いお年を。