リニューアルのケーススタディ、PSDファイルから自動コーディング、ロゴ検索ツール、グラフ用フォント(デザインとUX/UIのウィークリーまとめ)

リニューアルのケーススタディ、PSDファイルから自動コーディング、ロゴ検索ツール、グラフ用フォント(デザインとUX/UIのウィークリーまとめ)

こんにちは。

今週の【UX・デザイン】の情報共有です。

UI ・UX

アプリのリニューアルのケーススタディ

2年間まったく更新されなかった健康保険アプリのリニューアルの話です。

他社はどのようにしてリニューアルを行っているのか、それを知ることは大事だと思います。
今回のケーススタディの結論をかいつまんでご紹介すると、覚えておきたいポイントは4つあります。

  • ユーザに選択肢を一つ一つ、丁寧に見せること(認知負荷対策)
  • 一番分かりやすい文言の選択
  • 似た情報をまとめて、同じ場所・同じ箇所にグルーピングする
  • カスタマイズができるUI(プロフィール写真等)に何かしらのアピールがある

URL
https://medium.com/@perlerar/how-we-designed-oscar-2-0-fbba97087bae

PSDファイルから自動コーディング

今回ご紹介するツールはオンラインツール。
ブラウザからPSDをアップロードするだけで、サイトのコーディングが自動的に実行されてるというものなんです。

アップロード開始してから約2分ででき上がり!
将来、自由にカスタマイズして運用を行うようなサイトの場合はあまりオススメできませんが、とにかくスピード重視でPSDファイルと変わらないサイトを公開したい場合は完璧かもしれません。
ちなみに現在は無料。アウトプットされたソース(HTML,CSS.JS)も無料でダウンロードができます。

URL
https://rapidui.io/

デザイン

ロゴ検索ツール

SVG系のロゴ検索エンジンです。

複数のロゴストック(MaxCDN、SVG Porn、Logomono等)を利用するらしいです。
ロゴ検索サイトは数多くありますが、この検索エンジン1つで色んな場所から検索できる、いわば「まとめ」サイト的な役割を果たしているということですね。

URL
http://instantlogosearch.com/

グラフ用のフォント

結構前の話にはなりますが、以前ご紹介させていただいた「Datalegreya(http://figs-lab.com/en/datalegreya)」に似たフォントでsす。

似ているだけあって、目的も一緒。データを表示させるのに最適なフォントです。
もちろん、デザインは違いますので、用途や気分に応じて使い分けてもいいですね。

URL
http://aftertheflood.co/projects/atf-spark

では、今回は以上!

また来週!

Franck VESCHI

Franck VESCHI

シニア UI/UX デザイナー・デベロッパー at 株式会社ショーケース・ティービー
毎日、デザイン・UX・コーディング等に関係ある新しい技術・情報をわくわくしながら探しています。昔から好奇心の強い性格なのです!新規プロジェクトをいつも「冒険」のように受け取っています。このスタンスのお陰で、毎日の仕事が非常に面白いです。

今まで書いた記事:
http://bitwave.showcase-tv.com/author/franck/
Franck VESCHI

コメント