6月30日まで 新規会員登録とパッケージ出品で 2000円割引クーポンプレゼント! ※無くなり次第終了 ご利用方法

業務系システムのデザイン制作(コーディング不要) - kenshintaniの提案

kenshintaniの他の提案

提案文 :
nkawakamiさま、はじめまして!デザイナーのkenshintaniと申します。
普段はベンチャー企業でデザイナーとして活動しております。

ご提案に際して実際のイメージがつきやすいように、項目を想定の文言で置き換えさせていただいております。
ご利用になる内容に適宜置き換えていただければ幸いでございます。
サービスのフェーズに合わせて、実装のしやすさも考慮に入れて設計いたしました。

機能追加や修正に伴い、デザイン業務が複数回発生する可能性があると思いますが、柔軟にご対応できます。
また、UI上で情報構造を整理するのが難しそうな部分があるかもしれないと感じました。そういった部分でもご支援できるかもしれません。

【具体的なデザインのご説明】
・想定ユーザー
メインの解決課題が見積り作成業務ということで、想定ユーザーの年代は広めに想定しています。

・全体のトーン
広い年代のユーザーに対しては過度に先進的なデザインは理解されにくい傾向にあるため、まずは「馴染みやすく」「見たことあるかも」と感じられるデザインにいたしました。
その上で全体の均整やリズムを調整し「新しさ」や「美しさ」「使いやすさ」を感じられるデザインを目指しました。

・ナビゲーションメニュー
画面左端にメニューを縦に並べることで、今後機能が増えていった場合でも柔軟に対応でき、画面遷移がしやすく使いやすいUIになります。

・角丸
対象年齢層が広範な場合は角丸を小さく、対象が若年層の場合は角丸を大きくすると使いやすさが向上すると言われています。
対象ユーザー層に合わせて適度に調節してくださいませ。
角丸はボックスの4隅につけることで、ボックスが何らかの機能を持っているように印象付けることができます。

・ログインページ
ログインページにはサービスのイメージが伝わるイラストや画像を置くと分かりやすくすることができます。

・メニューページ
アイコンを利用することで、ユーザーの機能理解のハードルを下げることができます。
メニューの項目が決まりましたら、より相応しいアイコンを用意して分かりやすくできます。
追加イメージのように「ユーザー名」エリアのクリックで、「個人設定」や「ログアウト」のポップアップがでてくる形も一般的です。

・一覧ページ
検索欄は項目別に入力できるようなUIを配置いたしましたが、最初はシンプルなキーワード検索のみでも問題ないと思います。
また、選択点数が分かるようなUIを画面下部に配置いたしました。
補足画像のように、開くと選択中のものが分かるようなUIもご用意いたしました。

・フォント
Noto Sans JP
Black、Bold、Regularの太さを使用しております。具体的な使用箇所をご共有できます。
Googleが提供するフリーフォントです。

・カラーコード
#113366 青メインカラー ナビゲーションメニュー・ロゴに使用
#13438A 青セカンドカラー 選択中メニュー・ボタン・入力中フォームに使用
#ECEEF3 背景色
#BB1515 赤色
#111111 黒色
#FFFFFF 白色

【デザインのご共有について】
画像のみのご共有・ご説明でも問題ございませんが、より効率的にデザインの共有ができる基本無料の共同編集ツール「figma」でご共有することも可能です。
ご利用が初めての場合はご利用方法を簡単にご共有いたします。

【デザインの修正について】
デザインの修正には柔軟にご対応いたします。
但し大変恐れ入りますが、平日の日中は軽度のご対応のみになる場合がございます。

締切直前のご提出になり恐縮でございます。
どうぞご査収のほどよろしくお願いいたします。

添付ファイル オリジナルファイルは関連ユーザーのみ閲覧できます

  • Page1.jpg
  • Page2 & バリエーシ...
  • Page3 & 全体イメー...
  • Page4 & 補足イメー...
2023-09-27 00:58:35

ランサー情報

kenshintani (kenshintani)
個人 Webデザイナー 東京都 実績 2

相手のことを考えて丁寧なメッセージを心がけましょう。 サイト外取引行為 は禁止しております。