エンジニアの副業は週1からでも可能？副業の例や探し方も解説
- ITエンジニア
- 副業
新しいアプリをインストールしたとき、多くのアプリではチュートリアル画面が表示されますよね。
機能の簡単な説明のみに終始しているものもあれば、詳しい操作までを教えてくれるものもあります。
今回は、デザイナーにインスピレーションを与える魅力的なチュートリアル画面をセレクトしました。
目次
- iPhoneアプリのフロー説明画面
- デザイナーの合作で作られたUI
- 企業向けSNSのチュートリアル
- 教育アプリ
- サインインからチュートリアルへのモーション
- 旅行アプリのオンボード
- 宇宙をモチーフにしたオンボード
- 位置情報を取得するアプリのオンボード
- 旅行系アプリのオンボード
- 都市情報に関するアプリ
- コーヒーに関するアプリ
- ソーシャルネットワークコンセプトをコンセプトにしたアプリ
- 充電モーション
- 世界遺跡に関するアプリ
- アート情報を扱うアプリ
- モバイルアプリでの機能解説
- ロック画面の解説
- サンタになれるアプリケーション
- SNS連携の説明
- サポート内容の説明
- iOSのプロフィールのUI
- ユニークな動きをするインタラクション
- 体重管理アプリのオンボード
- キャンプアプリのオンボード
- 料理アプリの使い方
- ショッピングアプリのフロー説明画面
- ウォーキングSNSアプリのオンボード
- マテリアルデザインを活用したオンボード
- Googleアプリのオンボード
- まとめ
iPhoneアプリのフロー説明画面
アプリのフローを伝えています。1ページごとに綺麗にメッセージがまとまっています。
デザイナーの合作で作られたUI
柔らかい色合いと、かわいいイラストが特徴的です。予想外の色使いに、インスピレーションを得ますね。
企業向けSNSのチュートリアル
こちらもフロー画面ですが、画面の見せ方がとても美しいですね。
教育アプリ
教育系のアプリですが、マテリアルデザインを基調としてシンプルにまとまっています。
サインインからチュートリアルへのモーション
サインイン画面です。なめらかな動きが気持ち良いです。モーションを研究して、インスピレーションをカタチに変えましょう！
旅行アプリのオンボード
Ramakrishna V for Housing
ポップなエレメントと、色味を抑えてデザインされています。
宇宙をモチーフにしたオンボード
白と宇宙を彷彿させる濃いブルーの2色で構成されています。
位置情報を取得するアプリのオンボード
ハッキリとした色の背景と、丸みを帯びたエレメントが特徴的です。最低限の要素だけで構成されたシンプルなデザインからこそ、インスピレーションを得られますね。
旅行系アプリのオンボード
こちらも丸みを帯びたエレメントが特徴的なフロー画面です。
都市情報に関するアプリ
全体的に渋みを感じる落ち着いたトーンでまとまっています。
コーヒーに関するアプリ
ハッキリとしたオレンジをメインカラーに構成されています。影もぼかしを控えてくっきりと表現したメリハリの強いデザインです。
ソーシャルネットワークコンセプトをコンセプトにしたアプリ
ダークな背景に明るい色のキャラクターが特徴的です。
充電モーション
ブラーのかかった背景の美しいデザインです。モーションを研究して、インスピレーションをカタチに変えましょう！
世界遺跡に関するアプリ
神秘的な雰囲気を感じる紫に近いブルーで表現されています。
アート情報を扱うアプリ
白と黒のみで構成されており、大変シンプルにまとまっています。２色のみのシンプルなデザインなのに、美術館に行ったときのようなインスピレーションを得ますね。
モバイルアプリでの機能解説
かわいらしく、表情豊かなキャラクターが特徴的です。
ロック画面の解説
電子キーのロック解除画面ですが、スタイリッシュにデザインされています。
サンタになれるアプリケーション
クリスマスのプレゼントをおねだりするアプリです。サービス自体にユニークさはもちろん、ポップ過ぎないけれどかわいらしいデザインにインスピレーションを受けます。
SNS連携の説明
Sam Thibault for Handsome
補色を使い、コントラストを強めたデザインです。
サポート内容の説明
色数少なくまとめて、マテリアルデザインを基調にしています。
iOSのプロフィールのUI
使用している色数は多いのですが、使用箇所が少ないのとトーンが揃っているのでシンプルなデザインのなかでアクセントになっています。
ユニークな動きをするインタラクション
珍しいインタラクションが特徴的です。おしゃれですね。
体重管理アプリのオンボード
体重計のメモリが描かれています。シンプルに表現していますが、きちんと伝わるデザインですね。
キャンプアプリのオンボード
グラデーションや影をしっかりつけて、少し立体的なデザインです。
料理アプリの使い方
Andrej Radisic for Five
白と黒を基調にし、インタラクションにも高級感が漂う静的なデザインです。
ショッピングアプリのフロー説明画面
補色に近い色を使用して作られたアイコンが特徴的なフロー画面です。
ウォーキングSNSアプリのオンボード
写真にブルーを重ねて、全体的に青みを帯びたデザインです。写真が美しいですね。
マテリアルデザインを活用したオンボード
Ivan Bjelajac for Infinum
マテリアルデザインを基調にしながら、雲や水の透け感もしっかり表現されています。
Googleアプリのオンボード
Ivan Bjelajac for Infinum
マテリアルデザインを基調にデザインし、インタラクションを施したデザインです。昔のグーグルのロゴが使われていますが、古さを感じません。
まとめ
いかがでしたでしょうか？ インスピレーションを受けるデザインは見つかりましたか？
今回は情報をまとめる、ホワイトスペースが有効活用されている例が多かったですね。
是非、モバイル画面のデザインで参考にしてしてみてください！
（翻訳：Yuri Tanaka）
人気のフリーランス・副業求人
【リモートワークOK】大手からスタートアップまで、幅広い領域でユーザー体験を担うデザイナー/アートディレクター募集！
- #副業OK
- #新規事業
- #スタートアップ
- #急募
- #長期案件
- #スポット案件（1ヶ月）
- #フルリモートOK
職種：デザイナー
時給：2,500円 〜 4,000円
働き方：どちらでも可
エリア：東京都
【リモート可】【子育てママ歓迎】IoTサービスで世界中の家族を幸せに。アプリデザイナー(スマホ・タブレット) /Webデザイナー募集
- #スタートアップ
職種：デザイナー
時給：2,000円 〜
働き方：どちらでも可
エリア：東京都
【リモートOK】アート・エンタメ×ITでイノベーションを！新規事業のデザイナー募集！
- #スタートアップ
- #土日週末OK
- #急募
- #長期案件
- #正社員募集
- #フルリモートOK
職種：デザイナー
時給：5,000円 〜 8,000円
働き方：どちらでも可
エリア：東京都
All the design inspiration you need. It’s like crack for designers. And good for you too!
この記事はMuzliからの転載です。配信元または著者とコンテンツ契約を結び配信しています。
Onboarding inspiration for mobile apps
