見出し画像

Daily UI #021 フィットネスApp ログイン画面

 おはようございます。フィットネス、してますか?

私は平日4日は40分ほどの筋トレをしています。

私もフィットネスアプリを使っていて、30日間フィットネスというアプリを使用しています。かれこれ2年以上。

それはさておき、今日のお題。

スクリーンショット 2020-08-24 8.25.20

ジムはいらない派の私なので、このターゲットとかぶっています。(笑)

完成品はこちら。

画像2

コンセプト

●ペルソナ 
・Appで管理したい
・健康意識が高い
・ゆるベジタリアン実践中
・家で筋トレ、外で走る
・仕事は家ですることが多い


●機能面
・健康維持やストレス発散目的
・消費カロリーが分かる
・ユーザーにあったトレーニングを提案


使った色・フォント

スクリーンショット 2020-08-24 8.29.58

●フォント
MontserratFFF Forward
ロゴにFFF Forwardを使って、トレーニング感を出しました。(FFF〜は丸みがないので、一部Montserrat使用)

Montserratはイタリックや太字のバリエーションが多いので多用しています。



「男性」「筋トレ」アプリといえばパキパキとしたイメージなので、オレンジと黒ベースに構成しました。

ただ、筋トレ感みたいなんが全面に出過ぎちゃったかな…。


ユーザー課題の想像

・家で筋トレしたり、外に走ったりしたい。そのための管理アプリや筋トレアプリが欲しい
・健康維持が主な目的
・モチベーションがなかなか上がらない



制作にあたっての工夫点

・サインインとログインボタンの色を分けた
・ホバー時の動きもつけてみた
・個人情報入力部分にアイコンを入れて、瞬時に何を入れる項目かわかるようにした
・フォントを斜めにして、躍動感を出してみた
・バックの写真はユーザーの用途に特化していることを強調(ランニングや家筋トレを主。)
・やる気を出させるカラーで統一できた



振り返ってみての改善点

・パスワードを忘れた時の導線がない(これがないサイトで困った経験がある)
・もう少しメールとパスワードを入れるボックスの透明度を下げればよかった。
・ペルソナ のイメージが「ストレス発散」「ゆるベジタリアン実践中」なので、もう少し、リラックスできるような色(緑やブルー)を使ってもよかったかも。

制作時間 1時間20分 20分構成 1時間デザイン制作


画像4

画像5

メールアドレスやパスワードって忘れるものなので、その導線が必要ということが作っててわかりました…。次の課題では入れます…。



この記事が気に入ったらサポートをしてみませんか?