Kiyoshi Nakazato
サービスが人々に与える新しい価値を焦点にして記事をまとめています。
コミュニケーションのためのグラフィックデザイン。
体験をデザインするとはどういうことか。普段我々が生活する中に潜んでいる「体験」を具現化し、サービスやプロダクトの中に組み込む「UXデザイン」を焦点にした記事をまとめています。
https://kiyoshinakazato.studio.site/ STUDIOでポートフォリオサイトを作りました。詳細は後日noteに記載します！
ゼロベースからモバイルオーダーアプリのUIをデザインしました。 その過程をご紹介します。 今回は「#パターン作成編」となります。 その前の記事「#準備編」「#ラフデザイン編」も合わせてお読みください。 1. パターン作成の準備ラフデザインが済んだので、パターン作成の準備に取り掛かります。 一度UIを作成する中で自発的にアイデアが浮かんでいたり、参考UI調査時にもアイデアが見つかっています。 まずはそれらを一覧にしてまとめていきます。 ▼パーツ毎にUIパターンをまとめる
モバイルオーダーの話です。 利用した人なら既に体感していると思いますが、モバイルオーダーは飲食店での体験を大いに変えるサービスです。 実際に「これは本当に便利なサービスだ」と思わせるような取り組みは多くありませんが、待ち時間の短縮から表立って見えなかったカスタマイズまで、顧客の立場で利用すると様々なメリットを体感できます。 列に並ぶのが大嫌いな私にとっては、半ば革命的な瞬間でもありました。 デザイナーの立場からしても、モバイルオーダーは顧客データを取得するための身近で扱い
例えば、大きな滝が見たいと思って、海外旅行に行きたいとします。 色々な旅行サイトがありますが、一つの滝しか紹介していないサイトと、複数の滝スポットを取り扱っているサイトがあったとしたら、どちらを参考にして旅行先を決めますか？ できれば、色んな場所を閲覧できた方が目的の場所を網羅してから選択できますよね？大きいとか小さいとか、近くに休める場所があったら良いとか、様々な検討ができます。 既に行きたい場所がある場合は別ですが、やはり旅先の情報を比較検討できたら、納得のいく旅を設計
UI/UXデザインコミュニティBONOの「UIナビゲーションの基本」というUIパターンを学ぶコンテンツを紹介する。 最大の学び今更になるかもしれないが、UIデザインには「パターンが存在する」ということが最大の学びである。ナビゲーションも例外ではないので、紹介すると共に作例を展開していこうと思うのでお付き合い願いたい。 （作例は別の記事で紹介するよ！UIと共に作成中だよ！） 今回の学習は、サービスやコンテンツ若しくはアクションによって、ナビゲーションUIがどう構築されるか？
音声SNSアプリ、三部作の最終章。 どうぞよろしく。 この記事は、UI/UXデザインコミュニティBONOの「音声SNSアプリ」をデザインするというお題のフィードバック編である。 アプリの大元を考えるコンセプト編、グラフィックを作り込んだビジュアル編の後の、フィードバックからUIをカイゼンさせるという内容である。 ・カイさんから受けたフィードバック ・自分で気になったポイントをフィードバック の２本でお送りする。 ちょっとマニアックな内容になるかも知れない。 BONOの
前回の続き。 この記事は、UI/UXデザインコミュニティBONOの「音声SNSアプリ」をデザインするというお題のビジュアル作成編である。 前回はコンセプト編と題して音声SNSアプリのコンセプトを紹介したが、今回はビジュアルに落とし込む工程、個人的にどんな所に気をつけて作成したのかがメインとなる。 なるべく読みやすくなるように善処したい。 再三だが、この課題の目的は 「自分でUIをデザインしながら、基本パターンを学ぶこと」である。 基本パターンは、既存のサービスを参考にする
気づけば春が終わっていた。 その代わり、アウターを着込まなければならない早朝や、炎天下を思わせる白昼が入り混じって、一体何の季節なんだと清々しい日本晴れにツッコミを入れたくなる日々が続いている。 着実に日本の気候は変動していると思わざるを得ない。 現在UI/UXデザイナーに転職するため、朝に夕に奮闘中だ。 本記事はその奮闘記録である。 一刻も早く、アプリとかサービスとか事業戦略とか死ぬまで考えたい。 今回、お世話になっているUI/UXデザインコミュニティBONOから「音声
UI/UXデザイナーになるべく、やはり読書は欠かせないと思い、UI/UXについて巷でよく読まれている本をかき集めて読んでいる。 所感なので、さらっと見て頂けたら幸いである。詳細を知りたい場合は、リンク先の目次を読むなどして頂きたい。 ちなみに、私の能力として デザイナー歴10年ぐらい Adobeのソフト大体触れる Webコーディング（HTML、CSS） プログラミング知識はそんなにない（php、js、C#、python） GUI作成経験あり（固有のプロダクトにお
この記事は、UI/UXデザインコミュニティBONOの「グラフィック入門」という課題の後編である。まだ前編をご覧になられていない方はコチラから。 後編は、配色～デモサイト作成までの経緯を記述する。 ■最終アウトプット 7.配色所要時間：2時間 レイアウトおよびスタイリングのパターン作成段階では、変数が上がるためカラーリングをせずにいたが、それらがまとまってきたので、次は具体的な配色を行った。 作成したムードボードから、青色および黄色系の２通りのカラーパターンを抽出して
UI/UXデザインコミュニティBONOの「グラフィック入門」という課題を終了した。結構ヘビーだった。 制作過程を前編・後編にわたってお送りします。 一デザイナーの脳内を知りたい方はぜひお読みになって頂きたい。 後半はこちら。 0.はじめにBONOのグラフィック入門では、その名の通りグラフィックにフォーカスしており、見た目を作っていくプロセスをトレースする方法でUIデザインを学ぶ設計になっている。 一通りグラフィックデザインを学んだ人なら、従来のプロセスを知っていると思うが、
ギュスターヴ・ル・ボン曰く、群集心理とは情動的で扇動されやすく、原始人のような振る舞いをするのだが、時に英雄的でもあるらしい。 敬愛するナポレオン・ボナパルトが常勝将軍としてフランスにその名を轟かせ、皇帝に即位できたのは、この英雄的である群集心理を掌握して指揮を執ったからである。今で言うマーケティング能力に近い。いや、一英雄をマーケターにカテゴライズするのはどうか… いつの時代でも英雄的で原始人のような我々が、何を欲し何を求めているかを肌で感じることができれば、それに呼応
「どうなるのか分からない」＝「偶有性」 茂木健一郎さんのYouTubeが面白い。特に「偶有性について」の説明は、UXにおいてヒントになる。人間は予想できない事態に遭遇するとき、ドーパミンを用いて脳を活性化させ、脳を若返らせたり行動を変化させるという。脳が若返るのは人間の快楽なのだろうか？ 果たして、程よいバランスの情報が人間に対して心地よさを提供するものであれば、それは人間の欲求を満たす鍵となる。我々がゲームや映画の世界に魅力を感じるのは、さほど我々と相違しない世界なの
今回も、UI/UXデザインコミュニティのBONOによるUIビジュアル基礎コースの「配色の基本」という課題を完了したのでご報告する。 毎日、何かをやり続けるとフロー状態になるのではないか。少し苦しかったことも徐々に慣れてくるものだ。 1. 配色の基本×リデザイン 今回の課題は「SP版：動画詳細UIのリデザイン」である。 早速だが、リデザインのBefore／Afterを御覧いただきたい。 画像が小さくて見えづらい。どこを変更したというのか？Before側にペン入れする
人生は短い、すぐやる。 今回もUI/UXデザインコミュニティのBONOによるUIビジュアル基礎コースの「レイアウトのきほんでリデザイン！」という課題を完了したのでご報告する。 1.レイアウトの基本を意識してリデザイン 今回の学習の目的は「レイアウトの基本を実践」し、動画詳細UIをリデザインすること。 早速、リデザインのBefore／Afterを見て頂きたい。 ■Before ■After 主なレイアウトの基本は以下の４点である。 1-1. 情報の優先度を決め
今回、UI/UXデザインコミュニティのBONOによるUIビジュアル基礎コースの「ビジュアルシステムでリデザインしよう！」という課題を完了したので、その行程をご紹介する。 1.構造をシステム化するとは？1-1.まず、Before, Afterから 今回の学習の目的は「UIの構造をシステム化し、それを利用してUIを設計すること」である。Webデザインをしている人ならCSSフレームワークのような概念であると考えれば理解が早いと思う。 早速だが、リデザイン前とリデザイン後
