全5回 ハマダナヲミのPhotoshopで作るUIデザイン入門

ハマダナヲミ

スマートフォンアプリをユーザーにもっと楽しく使ってもらうために欠かせない、UIのデザイン。人気書籍『神速Photoshop［Webデザイン編］』の著者であるデザイナーのハマダナヲミさんが、Photoshopを使ったUIデザインのポイントをワークフローに沿って架空事例つきで解説します。

第1回 PhotoshopでUIデザインを始めるための準備と設定

2016/03/31

FREE
6
Photoshopはもともと写真編集のためのソフトでしたが、印刷物やWebのデザインツールとしても使われるようになり、いまではデザインツールとしても多く使われています。このLessonでは、iPhoneアプリを題材として、PhotoshopでUIをデザインする方法を紹介します。 アプリのUIデザインのワークフローを知ろう Webサイトの制作では、PhotoshopでのデザインからHTMLやCSSに

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

プレミアムメンバーの購読は現在、休止しております。新サービス開始まで少々お待ちください。

メンバーの方はこちらからログイン

Loading...

第2回 あのUI、Photoshopでどう作る？ 架空アプリのチュートリアルで学ぼう

2016/05/30

2
第2回はいよいよ、架空のiPhoneアプリを例に、実際にUIをデザインしていきます。お題は、現在の空模様の写真を撮影し、位置情報とコメントとともにシェアする「お天気投稿アプリ」です。 お天気投稿アプリは、以下のワイヤーフレームのような画面で構成されています。 このうち、今回は3つ目の「投稿画面」について、ディレクターが用意したワイヤーフレームをもとにPhotoshopでデザインを作成します。 1.

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

プレミアムメンバーの購読は現在、休止しております。新サービス開始まで少々お待ちください。

メンバーの方はこちらからログイン

Loading...

第3回 Photoshopで高品質なUIを作り込むチュートリアル

2016/06/20

0
第3回では、写真やアイコンを配置したり、質感を作り込んだりして、アプリのデザインを完成させます。 4.レイヤー効果を使って質感のあるボタンを作る お天気アイコンのボタンを作ります。このアプリのキーとなる「お天気選択機能」を実行するためのボタンですので、ユーザーにアプリを印象づけるデザインにしっかり作り込んでいきます。 まずはボタンのベースとなるシェイプを作成します。描画色を［172 205 238

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

プレミアムメンバーの購読は現在、休止しております。新サービス開始まで少々お待ちください。

メンバーの方はこちらからログイン

Loading...

第4回 Adobe PreviewでiPhoneアプリのデザイン確認

2016/07/15

0
Lessonの最後は、ここまでに仕上げたデザインを確認してエンジニアに渡すまでの手順を追って紹介します。 8.実機で見た目を確認しよう Photoshopでアプリのデザインを仕上げたら、iPhone実機に表示しましょう。第1回で紹介したアップルの「iOS Human Interface Guidelines」（HIG）にも規定されているように、ユーザーがきちんと操作できるかどうか、UIパーツのサイ

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

プレミアムメンバーの購読は現在、休止しております。新サービス開始まで少々お待ちください。

メンバーの方はこちらからログイン

Loading...