みそすーぷ

Webディレクターをしていましたが、やっぱり自分で作る側になりたい！と思いUI/UXデ…

みそすーぷ

Webディレクターをしていましたが、やっぱり自分で作る側になりたい！と思いUI/UXデザイナーに転職しました。 日々の学びを綴ります。

  • DailyUI

    UIデザイナー1年目の私が取り組んだDailyUIの記録です。

グラフィックの苦手なデザイナーが習得した、「映える」デザインを作るコツ

こんにちは。 事業会社でUIデザイナーをしているみそすーぷです。 今回は、「映える」デザインの作り方をご紹介します。 この方法論は自分で考えたわけではなく会社の先輩に教えてもらったことの受け売りなのですが…自分の場合はこのアドバイスを経てグッとビジュアル力が上がりました（当社比） 備忘録として何をやったか書いておきます。 どれくらい変わった？Before 私がデザイナーを始めたのは2年前からなのですが、2年前に作ったデザインはこんな感じでした。 After デザイナ

みそすーぷ

    • DailyUI #014 Countdown Timer

      以下のテーマで作りました！ 参考デザインできたものVer.1まず完成したものがこちらです。 できたものVer.2見た目があまりにも微妙だったので、作り直しました。 一回目に作った作品のコンセプトがよくわからなかったので、今回は「ボードゲームで使うタイマー」を想定して作りました。 時間を1分ずつ足せるボタンがあると便利かと思い、追加しました。 見た目はだいぶいい感じに整いました！ まとめ今見ると、一回目に作ったデザインのレイアウトが酷いです…😅 余白のルールや比率を使っ

      みそすーぷ

      • DailyUI #013 Direct Messaging

        以下のテーマで作りました！ 参考デザインできたもの完成したものがこちらです。 既読・未読・スタンプのリアクションがある時とない時などの状態変化をわかりやすくしてみました。 まとめうう、確かに…実機で見てみると、アイコンのタップ範囲が狭いことに気付きました。 Figmaのデザインデータと実機とでは見え方の印象が違うものなので、ちゃんと実機でチェックするようにしたいです。 ちなみに、Facebookのメッセンジャーのアイコンを調べてみたところ、以下で赤く記した範囲はちょう

        みそすーぷ

        • DailyUI #012 E-Commerce Shop

          以下のテーマで作りました！ 参考デザインできたもの完成したものがこちらです。 まとめなるほど。ほぼUNIQLOのトレースになってしまい、数量のUI（プルダウン）もそのまま脳死でパクってしまっていました。。 アプリっぽい数量のUIとはどんなものがあるのか調べてみたところ、以下のように＋−で数量を入力するアプリが多かったです。 数量の選択肢をプルダウンにするの、単純にタップ数が増えるのであまりよくないかもしれませんね。 基本、服は1つだけ買うことがデフォルトで、大量に買うも

          みそすーぷ

        グラフィックの苦手なデザイナーが習得した、「映える」デザインを作るコツ

        みそすーぷ

        マガジン

        • DailyUI
          6本

        記事

          DailyUI #011 Flash Massage

          こんにちは。事業会社でUI/UXデザイナーをしているみそすーぷです。 Daily UIの投稿は久しぶりです。制作は進めていましたが、noteの更新が追いつかず…。 複数の作品についてまとめて書こうとすると腰が重くなってしまう傾向にあるので、試しにこれからは1つずつ掲載してみることにしてみます🙇 ⭐️#011 Flash Massage参考デザイン なかなか、意図的にメッセージを出すことが難しかったので参考デザインは集めていません。 できたもの 完成したものがこちらで

          みそすーぷ

          DailyUI #011 Flash Massage

          みそすーぷ

          駆け出しUIデザイナーの、入社半年の振り返り

          こんにちは。UIデザイナー1年目のみそすーぷです。 早いもので、転職してから半年が経ちました…！ 今後また頑張っていくためにも、ここで一度仕事の振り返りをしていきたいと思います。 ⭐️私のプロフィール事務職→制作会社のWebディレクター→事業会社のWebディレクター→今年2022年〜事業会社のUI/UXデザイナー　という経歴で、 今年は未経験分野へチャレンジ中です！ 入社したらいきなり新規サービスの立ち上げに携わることになり、嬉しい気持ちはありつつも常にテンパってます。助け

          みそすーぷ

          駆け出しUIデザイナーの、入社半年の振り返り

          みそすーぷ

          【デザイン修行】Daily UIの振り返り#006〜#010

          こんにちは。UI/UXデザイナー1年目のみそすーぷです。 デザイナーに転身してから、修行のために始めたDaily UIの振り返りの続きをお届けします。 ※Daily UIとは、UIデザインを100日続けてデザイン力を鍛えるトレーニングです。以下URLから登録すると、平日毎日お題が届くようになります。 https://www.dailyui.co/ ⭐️#006 Profileテーマ設定 ・イラストを投稿する、お絵描きSNSのプロフィール画面 参考デザイン まず、参

          みそすーぷ

          【デザイン修行】Daily UIの振り返り#006〜#010

          みそすーぷ

          【BONO学習記録】UIビジュアル基礎 TRY1 ：コンセプトを考えてリデザインしよう！

          こんにちは。 UIデザイン修行僧のみそすーぷです。 今回は、BONOというデザインコミュニティで勉強した「UIビジュアル基礎 TRY1：コンセプトを考えてリデザインしよう！」について、振り返りをまとめます。 カイさんの解説動画を見てUIビジュアルの作り方を学び、その後自分でも実際にお題のリデザインをやってみました。 ⭐️【解説】UIビジュアルってどうやって作るん？まずは、BONOのカイさんによる作り方の解説をまとめます。 ①アイデア出し：誰が使うか？で見た目を考える

          みそすーぷ

          【BONO学習記録】UIビジュアル基礎 TRY1 ：コンセプトを考えてリデザインしよう！

          みそすーぷ

          【デザイン修行】Daily UIの振り返り#001〜#005

          こんにちは。UI/UXデザイナー1年目のみそすーぷです。 今年、デザイナーに転身してから、修行のためにDaily UIを始めました。 Daily UIとは、UIデザインを100日続けてデザイン力を鍛えるトレーニングです。以下URLから登録すると、平日毎日お題が届くようになります。 https://www.dailyui.co/ 実はデザイナーになる前にもいくつかDaily UIで作品を作っていたのですが、その時と今ではまた自分の知識面も変わってきているので、改めていちか

          みそすーぷ

          【デザイン修行】Daily UIの振り返り#001〜#005

          みそすーぷ

          【セミナーまとめ】デザインの見る目を変え、無限の引き出しとセンスを手に入れる

          こんにちは。事業会社でUI/UXデザイナーをしているみそすーぷです。 4月は、デザ研の1ヶ月限定コミュニティ「デザインの見る目を変えて無限の引き出しとセンスを手に入れる」に参加しました。 そこで学んだことを、備忘録も兼ねてアウトプットしていきたいと思います。 ⭐️講座の概要・デザインを見る目を鍛えて、無限の引き出しを手に入れるセミナー（オンラインセミナー1回＋ゲストのライブ配信4回） ・1ヶ月間毎日、”今日見つけたデザイン”を分析→アウトプット（言語化）を繰り返すことで

          みそすーぷ

          【セミナーまとめ】デザインの見る目を変え、無限の引き出しとセンスを手に入れる

          みそすーぷ

          【BONO学習記録】OOUI

          こんにちは。 事業会社でUI/UXデザイナーをしているみそすーぷです。 働いている会社でUIの改善案の提案をする機会があり そんな時にOOUIを使うとうまくデザインができると教えてもらったため、以BONOの動画でOOUIについて学びました。 動画については以下です。 いつものごとく、自分の備忘録も兼ねて綴ります！ なぜOOUIが必要か？OOUI＝オブジェクト指向UIデザインは、デザインを考える際のプロセスで、情報設計を考える時に必要なものです。 要件を考えるとき、「あ

          みそすーぷ

          【BONO学習記録】OOUI

          みそすーぷ

          独学・未経験でUI/UXデザイナーになるためにやったこと

          こんにちは。 私は今年、前職のWebディレクターからUI/UXデザイナーに転職しました。 現在、事業会社のUI/UXデザイナーとして働いております。 転職するために何をしたのかよく聞かれるので、どこかにまとめておいた方がいいかなと思いこちらに書いていきたいと思います。 そもそもディレクターからデザイナーになる人はレアケースだと思うので特殊すぎて参考にならないかもしれませんが、何かしら役に立つことがあれば嬉しいです。 転職前の私の状況前提として、転職前の私の状況は以下のよ

          みそすーぷ

          独学・未経験でUI/UXデザイナーになるためにやったこと

          みそすーぷ

          【BONO 学習記録】はじめてのUIデザイン

          こんにちは。 私は最近、UIデザインを体系的に学習したいと思ってデザインコミュニティの「BONO」に入会しました。 学んだことを都度アウトプットしていかないと忘れそうなので、noteに記録していきたいと思います。 BONOとは？YouTubeでデザインのノウハウを発信している「カイクン」さんが運営しているデザイン学習のコミュニティです。 コミュニティに入らなくても、一部コンテンツを除きほとんどの動画を見ることができます。（神です！） 動画はこんなかんじです↓ カイクンさ

          みそすーぷ

          【BONO 学習記録】はじめてのUIデザイン

          みそすーぷ

          デザインのドリル_演習20

          明けましておめでとうございます。 私は年末年始は引きこもってデザイン修行をしております。 私はデザインの中でも、バナー制作がいまだに苦手です。 UIデザイナーであってもバナーを作る機会はあると思うので、少しでもビジュアルデザインの幅を増やしたいと思い、バナートレースを再開することにしました。 そして色々と考えた結果、今回は「デザインのドリル」を使ってトレースを行いました。 お題となるバナーで使用する素材も全てダウンロードでき、使用フォントも紹介されているので、手軽にトレ

          みそすーぷ

          デザインのドリル_演習20

          みそすーぷ

          【まとめ】CSSNiteセミナー「認知プロセスモデルから学ぶUIの使いやすさの評価方法」

          以前、CSSNiteにて、UIの設計・評価・分析において役立つ「行動・認知プロセスモデル」の概念の解説および評価についてのセミナー（まぼろしの松田直樹さんによる）を受講したので 自分用のメモとして参考になった内容をまとめます。 使いやすさとは何か？「使いやすくする」というよりは、まず「普通に使える」を目標に作るのが良いそうです。そのためには、ユーザーの認知負荷を下げることが必要。 使いやすさの定義 ①物理的側面＝さわりやすい ②認知的側面＝理解しやすい 優れたUIは第一

          みそすーぷ

          【まとめ】CSSNiteセミナー「認知プロセスモデルから学ぶUIの使いやすさの評価方法」

          みそすーぷ

          1人で仕事をできるようになるのではなくて、1人で主体的に仕事を進めた上で、みんなで仕事をする。

          前職では、忙しい職場だったので一人で仕事を完結できると褒められたし 自分も人を巻き込むのが苦手なタイプだから、できるだけ一人で巻き取るほうが気が楽だった。 個人商店の集まりみたいな会社だったので、みんなが黙々とPCに向かっていて邪魔しちゃいけない雰囲気で。だから一人でやるのが正義のように思っていたところがあった。 それが、事業会社に来たらコミュニケーションが足りないことを注意されるようになった。 基本、チームで連携しながら動いていくので、自分一人で完結する仕事がほとんどない

          みそすーぷ

          1人で仕事をできるようになるのではなくて、1人で主体的に仕事を進めた上で、みんなで仕事をする。

          みそすーぷ