ニフクラ mobile backend(mBaaS)お役立ちブログ

スマホアプリ開発にニフクラ mobile backend(mBaaS)。アプリ開発に役立つ情報をおとどけ!

Apple Watchのアプリデザインに使えるデザインテンプレート×14選

ついにApple Watchが4月10日より予約開始と発表されました。それに合わせてApple Watch向けのアプリを開発したいと思っている方も多いのではないでしょうか。UIがさらに小さい分、これまで以上に情報設計が問われるようになるでしょう。

そんなApple Watchアプリ開発に役立つデザインテンプレートをまとめて紹介します!

Apple Watch Human Interface Guidelines: Designing for Apple Watch

Apple公式のApple Watchヒューマンインタフェースガイドラインです。まず最初にここのチェックは欠かせません。

Apple Watch Human Interface Guidelines: Designing for Apple Watch

Apple Watch GUI PSD by impekable

様々なアプリで使えそうなデザインが32種類提供されています。フォーマットはPSDです。

Dribbble - Apple Watch GUI PSD by impekable

Apple WATCH by Fabio Basile

ジョギング系アプリのUIが見られます。大きいグラフと小さいグラフの2パターンがあります。フォーマットはSketchです。

Dribbble - Apple WATCH by Fabio Basile

Apple Watch Screen PSD — happywatch

アイコンが並んだデザインのPSDファイルがダウンロードできます。

Apple Watch Screen PSD — happywatch

Apple Watch Free Template by Juan Carlos Ferraris

ディスプレイだけでなく横向きのデザインも提供されています。フォーマットはPSDです。

Dribbble - Apple Watch Free Template by Juan Carlos Ferraris

Apple Watch Free Template PSD by Francesco Scalambrino

こちらはスポーツバンドタイプで斜めのデザインになっています。フォーマットはPSDです。

Dribbble - Apple Watch Free Template PSD by Francesco Scalambrino

Apple Watch .sketch by Ray

ディスプレイには何も入っていないのでモックアップ的に使えそうです。フォーマットはSketchです。

Dribbble - Apple Watch .sketch by Ray

Free Download: Apple Watch Mockup Built in Sketch (100% Vector) | HackingUI

シンプルな白黒のUIになっています。フォーマットはSkitchです。

Free Download: Apple Watch Mockup Built in Sketch (100% Vector) | HackingUI

Apple Watch Vector UI Kit for Keynote and PowerPoint | Keynotopia

非常に数多くのデザインパターンで、かつそれがPowerPointとKeynote向けに提供されています。プレゼンで活かすのに良さそうです。今だけ限定無料です。

Apple Watch Vector UI Kit for Keynote and PowerPoint | Keynotopia

Apple Watch GUI Sketch Sketch freebie - Download free resource for Sketch 3- Sketch App Sources

Apple Watch GUI PSDと似ていますが、こちらはSketchフォーマットになります。お好みに合わせてどうぞ。

Apple Watch GUI Sketch Sketch freebie - Download free resource for Sketch 3- Sketch App Sources

Apple Watch concept GUI | Jan Losert portfolio

40種類を超えるパターンのApple Watchのデザインを配布しています。ディスプレイサイズは38mm、42mmの2パターンで提供しているなど細かい点にも気が配られています。バージョン1は2500回以上ダウンロードされたとあり、人気のテンプレートになっています。

ファイルもPSD、Sketchの両パターンで提供されています。

Apple Watch concept GUI | Jan Losert portfolio

Apple Watch GUI Sketch by Richard Burton

デザインはApple Watch GUI PSDなどと同じですが、42mm/38mmの2パターンで提供されています。フォーマットはSketchです。

Dribbble - Apple Watch GUI Sketch by Richard Burton

UX Diagrams Kit for iPhone 6/6 Plus and Apple Watch by Alex Tsayun

アプリのデザインと言うよりも、iPhoneとの連携であったり、指先の操作などUXに注目したデザインです。Sketchフォーマットになります。

Dribbble - UX Diagrams Kit for iPhone 6/6 Plus and Apple Watch by Alex Tsayun

Apple Watch UI Kit - The Design Blog

プロトタイプのベースになるデザインはもちろん、様々なパーツやタップした時の動作説明なども書けるようになっています。Illustratorファイルになっています。

Apple Watch UI Kit - The Design Blog

UARRR.org

Sketch 3.2用に作られた42mmのApple Watch用テンプレートです。細かな部品がたくさん登録されています。

UARRR.org


いかがでしょうか。Photoshop、Sketch向けが多いですが、中にはPowerPointやKeynote、Illustratorもあります。自分の環境に合わせて最適なテンプレートフォーマットを選んでください!

f:id:mbaasblog:20180927115226p:plain