チャレンジ:スーパーヒーローなナビゲーションを実現するデザイン

すべてのデザイナーのみなさんへ。開発者というヒーローがコードやデザインに起こる大惨事と戦うAppのために、力を尽くして「スーパーな」ナビゲーションエクスペリエンスをデザインしてください。

この課題では、お気に入りのスーパーヒーローを助ける架空のAppのタブバーと画面をデザインしてください。どのようなAppを作るにしても、そのコアとなる機能をタブバー上のセクションに整理することが課題です。

ボーナス:もし、「スーパー」クリエイティブな気分なら、そのAppのタブの中から1つ、ルート画面をデザインしてください。みなさんのヒーローが確認する必要があるものは何でしょうか。ヒーロー達はどのような行動を取るでしょうか(注:デザインするのは1つの画面だけですが、このビューでデザインされた機能は、提案するAppの他のタブと調和して動作する必要があります)。

また、Design Study Hallで、この課題に協力して取り組むこともできます。さらに、質問したり、他の開発者とつながったり、自分の作ったものを共有したりすることができます。

課題を始める

まずは、「Explore design navigation for iOS」をご覧ください。既存のナビゲーション構造を活用して、Appの個性を損なうことなく複雑なインタラクションを簡素化する方法を学ぶことができます。タブバーやモダリティなどを扱う際のベストプラクティスやよくある落とし穴を紹介します。

また、「Writing for interfaces」では、わかりやすく、会話式の、役に立つラベルや文章をAppで作成する方法をご紹介していますので、ぜひご覧ください。

iOSナビゲーションデザインの探求

...

Watch now

インターフェイスのライティング

...

Watch now

デザインを始める準備ができたら、Apple Design ResourcesのページからiOSデザインテンプレートをダウンロードして、タブバーのシンボルやiOSシステムカラーにアクセスしましょう。また、タブバーに魅力的なアイコンを作成するために、SF Symbols Appをダウンロードして確認することをお勧めします。

iOS Appでは、2~5つのタブを追加できます。デザインするスーパーヒーローAppに最も必要な機能はどれかを考えてみてください。各タブには、説明的で簡潔なラベルを使用するようにしましょう。

Discover Apple Design Resources

Download SF Symbols

「#WWDC22Challenges」のハッシュタグを付けてTwitterで作品を見せてください。また、Design Study Hallで作品を共有してください。また、デザインに関するトピックの意見交換をしたい場合は、WWDC22の残りの期間中に開催されるイベントにご参加ください。

Explore #WWDC22Challenges on social media

Read the WWDC22 Challenges Terms and Conditions