名称未設定-1

UIデザインで参考にするブックマーク集

Chrome のブックマークバーが散らかってきました。Kanmu のデザイナー、小山内です。

年末だし、ここらでブックマークを整理してみようと思いまして。アプリデザインのときに参考にしているサイトをまとめてみました。

これは カンム Advent Calendar 2019 の3日目の記事です。


必要なリソースが見つかるサイト

インスピレーションが得られるサイトをお探しですか? トレンドに関する新情報をお探しですか? それとも UI Kit? デザインツール? フリー素材?

以下のようなデザインリソースをまとめたサイトを覗いてみてください。たいていのモノはここで見つかります。


インスピレーションのために見るサイト

デザインのトレンドを調査するときにもよく見ていたサイトです。

🌀プロダクトのカテゴリやUIパーツごとに整理されているサイト

条件を絞ってデザインを探すとき、例えば「SNS系アプリのウォークスルー」を調べるときなんかは、プロダクトのカテゴリや画面ごとに検索できるサイトが役に立ちます。Mobbin にはその機能が備わってますね。

Mobbin

画面パターンやエレメントごとにフィルタリングすることができます。

🌀プロダクトのカテゴリごとに整理されているサイト

Music や Fintech といったカテゴリに絞って検索したいときはこちら。

UI Sourcesの方が1アプリあたりのコンテンツが充実しています。インタラクションを動画で確認することもできますね。

🌀画面やUIパーツごとに整理されているサイト

Login や Tabbar といった画面やUIパーツに絞って検索したいときはこれらのサイト。

UI Garage

Collect UI

------

------

------

------

UI Movementinspiration UI はウェブのUIも含まれてきます。

🌀さくっと見たいときのサイト

さくっとアプリデザインのトレンドをつかむために見るサイトは以下の定番サービスを使ってます。


デザインデータのダウンロードサイト

心地の良いグラデーションやシャドウなどを研究するときや、データの作り方などを考えるとき、他のデザイナーがつくったデザインデータを見るのがとても参考になります。

🌀様々なデザインツールに対応しているダウンロードサイト

UI8

DesignerMill


UI Kitの列にデザインシステムの Sketch や Photoshop データへのリンクが掲載されています


Freebiesbug

Adele は有名サービスのデザインシステムをまとめたサイトで、FirefoxMicrosoftAudi などの資料が見つかるのでおもしろいです。

🌀Sketch データのダウンロードサイト

弊社では主に Sketch を使っているので、こちらのダウンロードサイトもブックマークしていました。


最新情報をキャッチアップするサイト

トレンドをキャッチアップするために見ているサイトたち。これらはFeedly(Pro)に登録して、登録した記事の中からFeedlyで人気のあるものを順に眺めたりしてます。

はてぶ(「UI | UX」の検索結果画面)

------

#デザイン  記事まとめ

------

------


日常業務で参照するサイト

最後にカンムのデザイン業務で使うサイトやツールです。


おしまい

今回はアプリデザインに関するブックマークに絞ってご紹介しました。ぼくは Kanmu に来てから SQL を覚えて Redash を触るようになりまして。最近は Google Optimize を使って Web の ABテストにどんどん取り組もうとしているところです。

新しいツールを探したり使うのが楽しい。

ツールマニアのデザイナーさん、おすすめのサイトやツールがあったら教えてください!

ちなみにカンムにご興味がある方はこちら


次回記事のため、書籍代等のインプットに使わせていただきます!