ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Webサイトを開発する際に使われるのが画面遷移を表現するフローチャートです。例えばコマースであればトップページから商品一覧、カテゴリ一覧や商品のピックアップなどの遷移が考えられます。

深くなってしまう場所がないか確認したり、ユーザ動線が正しく描けているかどうか確認するのに便利です。UI Tilesはそんなフローチャートを作成するのに便利なデザイン集です。

UI Tilesの使い方

UI TilesはPNGの他、PhotoshopやIllustrator形式でファイルが配布されています。

PNG版。画面のモックがたくさんあります。
PNG版。画面のモックがたくさんあります。

それぞれ小さいながらも特徴があります。
それぞれ小さいながらも特徴があります。

動画プレーヤ、ポートフォリオページもあります。
動画プレーヤ、ポートフォリオページもあります。

PSDはデモも用意されています。
PSDはデモも用意されています。

デザイン一覧。
デザイン一覧。

Illustratorも同様です。
Illustratorも同様です。

UI Tilesを使うと、これまでは単なる四角い枠に対してトップページなどとラベルを貼っていたのが、具体的で分かりやすくなるでしょう。特徴だけピックアップしているので、Webサイトの新規作成も更新の時も便利に使えることでしょう。

UI TilesはPNG/PSD/AI製のソフトウェアです。

UI Tiles: Website Flowcharts

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2