最近見つけたＷｅｂ関連ネタ

雛希 — Wed, 12 Apr 2017 03:36:25 +0000

めっちゃくちゃお久しぶりの更新です。
忘れていたわけじゃないんですが、取り立ててネタもなく。
SL関連で、マイトレもbento対応したっていうネタはあったはあったんですが・・・。
で、仕事もなんとなく暇になったので、折角なので。

CSS Animation

日本語対応していますが、日本語だとものすごい記事数少ないので、頑張って英語読むほうが良いです。

CSS Animation Weekly（メルマガ登録）

https://cssanimation.rocks/weekly/
CSSアニメーションテクニックやチュートリアルの解説メールマガジン。
（※英語オンリー、要辞書か翻訳サイトｗ）
登録すれば、過去記事含めすべて閲覧できます。
Codepenへのリンクだったり、他サイトへのリンクだったりとです。
今日時点で#37まで記事が公開されています。
javascript依存のものが多いですが、こんなことまでできるのか！！！って感じで、見ているだけでもかなり楽しいです。

See the Pen First Bite Type R Animation by leoman (@leomanlapera) on CodePen.

とかね。（ローディング画面とかに使えそう）

未だに、@keyframesとかはニガテです。

Codrops

https://tympanus.net/codrops/

Webサイト構築関連の、チュートリアルとかの紹介サイトです。
デザインとかで行き詰ったときの参考にもなると思います。
また、チュートリアルやブループリント（設計図？なんかテストってことですかね）ではデモの閲覧とソースのダウンロードができます。
CSSリファレンスページは、カテゴリごとに可愛くまとめてあって、コレは普通に便利です。

Design Seeds

https://www.design-seeds.com/

色関連で悩んだら・・・。
写真から色を抽出して表示してくれています。
カラースキームなどで組み合わせてもしっくりこない、なんか違うといわれる、独自センスだとやばいことになる
そんな自分みたいな超絶色オンチにはありがたいサイトです。

綺麗な画像が多いので見ているだけでも目の肥やしになって良いですよ。

AutoDraw

画伯に朗報。
https://www.autodraw.com/
適当な線を描いても、もしかしてこれじゃない？っていう図形をすぐさま提示してくれます。
適当な線から絵を構築するには、キラキラ光ってるっぽい鉛筆のアイコンをクリックして、カンバスに絵を描くと上に一覧が出てきて、その中から使いたい図形をクリックするだけで反映されます。

普通に自分の書いた絵も使いたいようであれば、キラキラしてない鉛筆アイコンをクリックで絵を描けば大丈夫です。
テキストの入力もできます。

難点は、自分の欲しい形が無かった場合・・・どうにもならないということですね。

紹介動画

参考元記事
http://jp.techcrunch.com/2017/04/12/20170411googles-autodraw-uses-machine-learning-to-help-you-draw-like-a-pro/