記事一覧
【UX入門】サブスク管理アプリ作成からUXを学ぶ
UX的3つの手法 - サービスや機能アイデアのコンセプトデザイン今回から、サブスク管理サービスを作りながら、ユーザーエクスペリエンス(UX)についての実践をしていきます。
最終的に作成した画面はこちら
この画面に至った経緯を記載していきます。
【今回のお題】
今回は、価値定義とプロトタイプをセットで作成していきます!
今回のお題を学ぶと以下のことが学べます。
今回の考える範囲の図解
BONO【出張申請ソフト】デザインやってみた!!Vol.2:承認リスト編
承認リスト関連カイクン(@takumii_kai)さん(※以下敬称略)のデザインコミュニティBONOで未経験からデザインを学んでいるuです!
前回はBONOのロードマップにある出張申請のコンテンツを実施し、フィードバックを受けた結果の申請リスト画面を作成していきました。
前回の記事はこちら
今回は、前回の続きである出張申請ソフトの承認リスト関連の画面を作成していきます。
【Figmaプロト
BONO【出張申請ソフト】デザインやってみた!!Vol.1:申請リスト編
カイクン(@takumii_kai)さん(※以下敬称略)のデザインコミュニティBONOでデザインを学んでいるuです!
今回はBONOのロードマップにある出張申請のコンテンツを実施しました。
モヤモヤしつつも作っていたため、約3か月もかかってしまいました。
3か月も作り込んだため、一度カイクンからのフィードバックを受けたいと考えました。
今回は、出張申請のフィードバックが返ってきた結果、どん
デジタル庁ウェブアクセシビリティ導入ガイドブックの要約と考察やってみた!
カイクン(@takumii_kai)さんのデザインコミュニティBONOで、未経験からデザインを学んでいるuです!
先日、BONOで【ウェブアクセシビリティ導入ガイドブック|デジタル庁を読む会】という勉強会が行われました。
勉強会で行われたことの詳細は、メンバー限定であるため、他のメンバーがシェアした内容は実際に参加した人のお楽しみとして、この記事では勉強会の概要と自分が参加したときにどんなこと
BONO【UIデザインの基本➪応用】やってみた!!
※スマホ上で見られない可能性があります。ご注意ください
カイクン(@takumii_kai)さん(※以下敬称略)のデザインコミュニティBONOでデザインを学んでいるuです!
今回は前回のシリーズで作成したSpotifyの機能を初めて使う人がわかりやすくするためのUIを作成していきます。
前回の記事はこちら
記事内のスライド画像は、BONOのコンテンツ内のスクリーンショットです!
私が作成
BONO【UIデザインの基本】やってみた!!
カイクン(@takumii_kai)さんのデザインコミュニティBONOでデザインを学んでいるuです!
今回はBONOのロードマップ内にある
UX入門コースにチャレンジしていきます!
記事内に出てくるスライドは、BONOの動画内のスクリーンショットです。(こんなスライド作れるようになりたい……!!!)
私が作成したものは、実践したものの図や一部のUIです。
この記事を読むことで、BONOで
UIビジュアル基礎 TRY6 UI構造を意識してリデザインしよう!
お題リデザインするポイント
①階層の関係
②UI基本構造
③モードチェンジ
お題スライド
今回のリデザインはこちら!
所感UIビジュアル基礎 TRY6 完了
【作業時間】
動画視聴 90分
デザイン 120分
リデザイン 20分
【所感】
階層構造の理解はこれまでの勉強で身に付いてきていることを感じた。概ね解答動画とのズレはなかった。
モードとモーダルの概念は理解が進んでいる
UIビジュアル基礎 TRY5 レスポンシブなホームUIをデザイン!
お題リデザインするポイント
①ブレイクポイント
②可変/不可変
③ブロックを意識する
お題スライド
どんなの作った?
所感UIビジュアル基礎 TRY5 完了
【作業時間】
動画視聴 65分
デザイン 220分(半分ぐらいは可変データが作れないかチャレンジしていた……)
リデザイン 30分
【所感】
・PC→スマホへの画面サイズの作成をした。
・レスポンシブデザイン作るのは難しいかもし
UIビジュアル基礎 TRY4 スマホの動画詳細UIをリデザイン!
お題リデザインポイント
赤以外に使える色を決める
作った後に必ずリデザインする
どんなものを作った?所感
UIビジュアル基礎 TRY4 完了
【作業時間】
動画視聴 70分
デザイン 35分(解説動画後リデザイン含む)
【所感】
・色のポイントを変えるところが、少なめだったので、比較的早く終わった。お題の中で難易度が易しいお題だった。
・プライマリカラーのアクションは基本的に1つにする
・
UIビジュアル基礎 TRY3 動画詳細UIをリデザイン!
①お題と作成したもの今回はこちらの動画シリーズを参考にお知らせしていきます。
リデザインポイント
所感どんなものを作った?
UIビジュアル基礎 TRY3 完了👏
【作業時間】
動画視聴 85分
デザイン 65分
【所感】
レイアウトグリッドの機能を使うことができた
グリッドを活用することで、比率の目星がつくようになった。
余白のスペースに色をつけることで、視覚的に余白がわかりや
UIビジュアル基礎 TRY2 ホームUIをリデザイン!
UIビジュアル基礎:ホームUIをリデザインに挑戦し、見た目のシステム化を学ぶ今回は、デザインコミュニティBONOのコンテンツの1つであるUIビジュアル基礎②ホーム画面のUIをリデザインしていきます。
前回のように構造と見た目のリデザインではなく、見た目のリデザインが中心となっています。
今回の学びまとめ
ホーム画面のUIをリデザインしていきながら、デザインシステム(簡易版)について学ぶことが