タカフミのデザインについて思うことタカフミのデザインについて思うことはじめてのコーディングはじめてのデザインillustratorPhotoshopSketchFigma仕事のご依頼ホームデザインiOSのセレクトボックスにいつも僕は悩まされる2018/02/16SHAREツイートシェアはてブGoogle+PocketLINEこんにちは、タカフミです。僕はスマートフォンにiPhoneを使っています。説明するまでもなく、度重なるiOSのアップデートによりとても使いやすくなってきています。iPhoneXでホームボタンが廃止された代わりに搭載されたジェスチャーベースのインタフェースには舌を巻くものがあります。慣れるととっても便利です。出来たiOSでもセレクトボックスは改善の余地ありとても使いやすくなっているiOSですが、それでも毎回操作に悩まされる場面があります。それは、ウェブサイト上の申し込みフォームで問合せ情報を入力する時です。一般的に問合せフォームには、名前を入力するテキストフィールドやラジオボタンなどがあると思います。その中でも、問合せ内容を一覧から選択する場合に使うセレクトボックスに頭を悩ませられることがあります。上のようなフォームで「ご相談内容」を一覧から選択するために、「選択してください」ボタンをタップすると次のようになります。画面下部にスライダー用のUIが表示されて、そこから任意の選択肢を選ぶ流れになるのですが、ここの部分に問題があると僕は思いました。それは、リストから項目を選択した後のアクションが不明瞭だということです。本来ならスライダパネルの右上部分にある「☓」ボタンをタップして、スライダパネルを閉じることで選択した項目がセレクトボックスに反映される形になります。この「☓」のアイコンには操作そのものを取消すという誤ったイメージを与えてしまう可能性があります。そのため、ユーザーは「項目は選択したけど、この☓をタップしたら操作が無効になってしまうかも。」という不安を持ってしまい、項目確定のアクションを遂行できなくなってしまいます。僕の場合は、以前に学習しているのにも関わらず、毎回このセレクトボックスのところで一瞬操作に迷ってしまうほどです。それほど、この「☓」アイコンは誤解を招きやすいアイコンであるともいえます。閉じる」というものでした。一般的に考えて、「選択」してから「閉じる」という流れはどうも不自然に思えます。これでは、「自分で項目を選んで確定した」という認識が弱まってしまいます。そこで、僕なりに改善したUIを考えてみました。単純なのですが、スライダーの下部に新しく「決定」というボタンを追加しました。決定」という意思決定の自然なプロセスに従ったものになります。操作のフローを上から下に流れるI字型にしたことにより、従来のV字型のフローよりも自然な流れになっています。amazonはすごいねいつもお手本にしているアマゾンは流石にひと味違いました。kindleブックの配信先を選択する部分です。セレクトボックスをタップすると、次のようにモーダルウィンドウ上にセレクトボックスが表示されます。タップして確定」というプロセスが明確になり、非常にわかりやすいUIになっています。それにしても、一覧に表示されるデバイス数がとんでもないことになっていますね。最近、まわりにガジェットが増えているとは思っていたのですが、ここまであるとは思いませんでした。CLOUDはビジネスをされている方をデザイン面でサポートする定額制のデザインサービスです。デザイナーが完全定額・無制限で、あなたに代わって、広告やバナーなどビジネスに必要なデザイン関連の業務をプロのクオリティで行います。面倒な年契約はなく、業務に応じて柔軟にご利用いただけます。苦手なデザイン業務に時間を割く必要はありません。基礎を学ぼうPhotoshopでブラシを使って画像を切り抜いてみよう意外としらない!?illustratorで入稿するときは画像のリンクを確認しよう。趣味で作ったウェブサービスが大手VCの目に止まったことがキッカケで、教育系ベンチャーで働くことになったデザイナー兼エンジニア。現在はフリーのクリエイターとして活動中。ウェブサイトやアプリケーションの開発を行うかたわら、ウェブサイトやアプリのUIデザインもしています。個人で独立・開業される方のビジネスをロゴ、名刺、ウェブサイトなどを通じてブランド面からトータルでデザインすることが得意です。デザインについてのご相談はこちらのフォームからお問い合わせください。基礎を学ぼう次の記事UXワークショップ「コンテキストの理解と実践」に参加したら、す...デザインコースアプリ日々のデザイン業務で困っていた事を解決するために、タスクとフォルダを同時に管理できる超シンプルなタスク管理アプリを作りました。思いついたアイデアをサクッとメールに送信できるiPhone専用のメモアプリです。趣味で作ったウェブサービスが大手VCの目に止まったことがキッカケで、教育系ベンチャーで働くことになったデザイナー兼エンジニア。現在はフリーのクリエイターとして活動中。ウェブサイトやアプリケーションの開発を行うかたわら、ウェブサイトやアプリのUIデザインもしています。個人で独立・開業される方のビジネスをロゴ、名刺、ウェブサイトなどを通じてブランド面からトータルでデザインすることが得意です。フリーランスのデザイナーさん向けに超シンプルなタスク管理アプリDesignBoxを作っています。デザインについてのご相談はこちらからお問い合わせください。