i3DESIGN Designers

i3DESIGNのデザイナーチーム公式アカウントです。 UI/UXデザインのナレッジや…

i3DESIGN Designers

i3DESIGNのデザイナーチーム公式アカウントです。 UI/UXデザインのナレッジやチームの取り組みなどを投稿していきます! 【デザイナー募集中】https://hrmos.co/pages/i3design/jobs

マガジン

  • ユーザビリティチェックリスト

    ユーザーを迷わす可能性があるUIデザインの「あるある」を取り上げ、改善案とセットでまとめた記事です。

  • UI問題集

    UIデザイナーが直面したUIデザインのさまざまな『問題』を深掘りした記事です。

最近の記事

iOSの構造設計を考えてみよう

こんにちは!i3DESIGNデザイナーチームです。 今回は、iOSの構造設計についてお話していきます。 一見アプリにも、Webサイトと同じようなデザインや構造設計が適用できると思いがちですが、実はそれぞれ異なるアプローチが必要です。特にiOSにおける構造設計には、Apple独自の理念と原則(Human Interface Guidline)が存在するので、ガイドラインの理解が重要になります。 ユーザーが違和感なく操作できるアプリを作成できるように、iOSの構造設計を考えて

    • とってもやさしいウェブアクセシビリティチェックリスト

      こんにちは!i3DESIGNデザイナーチームです。 今回は、先日発刊させて頂きましたホワイトペーパー”とってもやさしいウェブアクセシビリティチェックリスト”の一部を記事にまとめたいと思います。 ホワイトペーパーには、ウェブアクセシビリティチェックリストというシートがあります。 このシートは、JIS X 8341-3:2016(アクセシビリティについてのJIS規格)に基づき、私たちの解釈で分類・文章を再構成しました。 エンジニアやデザイナーでない方でも理解しや

      • 混同しがちなUI用語の用法を整理する【モーダル/フィードバック編】

        はじめにこんにちは!i3DESIGN デザイナーチームのUIデザイナー関口です。 今回は、モーダルやアラート、ダイアログなど、ユーザーにフィードバックを提供するためのUI表現における言葉としての定義の違いをまとめました。 チームのコミュニケーションの中でも混同しやすいこれらの定義をしっかりと理解することで、チーム内で共通認識を持ち、スムーズなやりとりを実現することができると思います。 ぜひ、この機会に疑問を解消しましょう! 1.モーダル・アラート・ダイアログ・ポップアップモ

        • デザイン作業をもっと快適にするFigmaのテクニック集

          はじめにこんにちは!i3DESIGNデザイナーチームです。 今回は、チームでFigmaを使ってデザインしている方に向けた実務で活かせるFigmaのノウハウをお届けします!ポイントを押さえて、作業のスピードをアップしましょう! 1. ComponentVariant properties と Component propertiesの使い分け FigmaのComponentには「Variant properties」と「Component properties」の2種類のプロ

        iOSの構造設計を考えてみよう

        マガジン

        • ユーザビリティチェックリスト
          i3DESIGN Designers
        • UI問題集
          i3DESIGN Designers

        記事

          実案件から学んだ、本当に役立つUIデザインの法則50 ユーザビリティチェックリスト総集編

          こんにちは!i3DESIGNデザイナーチームです。 今日は、私たちが様々なクライアントのプロダクト・サービスの改善を行っていく中で得た、ユーザビリティを改善するためのヒントを50個シェアしていきたいと思います。 マガジン「ユーザビリティチェックリスト」01〜09ののまとめ記事です。 「ユーザビリティチェックリスト」ということで、UIデザインの「あるある」を取り上げ、改善案とセットでまとめています。 今回は、10のヒューリスティクスをもとに分類してみました。10のヒューリス

          実案件から学んだ、本当に役立つUIデザインの法則50 ユーザビリティチェックリスト総集編

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #09

          こんにちは!i3DESIGN デザインチームです。 季節もすっかり冬になりましたね⛄️ 個人的には暑い夏より寒い冬が好きだったりします。 前回の投稿からだいぶ期間が空いてしまいましたが最後のユーザビリティチェックリストのご紹介です。 No.01〜No.50のチェックリストをまとめた記事も今後投稿しますのでぜひチェックしてください。 ----- 46.条件は先に提示する誰しも、自分のした作業が無駄になることは嫌なはずですが、システムでもそのようなことが起こります。例え

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #09

          UIデザインのための10のヒューリスティクスについて改めて考えてみた

          はじめにこんにちは。i3DESIGNデザイナーチームです。 「ユーザーインタフェースデザインのための10のユーザビリティヒューリスティクス(10 Usability Heuristics for User Interface Design)」をご存知ですか? https://www.nngroup.com/articles/ten-usability-heuristics/ 1994年にヤコブ・ニールセンによって提唱され、現在も多くのデザイナーが使用している、良いUIデザ

          UIデザインのための10のヒューリスティクスについて改めて考えてみた

          デザインに役立つ!知っておきたい書体の知識とフォント選びのコツ

          こんにちは!i3DESIGNデザイナーチームです。 今回のテーマは、デザインに欠かせない「フォント」です。 大事と分かっていながらも、あまりきちんと学ぶ機会がなく、なんとなくの理解で終わってしまいがちではないでしょうか?? この記事では、文字の見栄えを整えるための基礎知識や良いフォントの選び方を、デザイナーチームが先日社内で行った勉強会の内容をもとにご紹介します! 後半ではチームメンバーのおすすめフォントも紹介しているので、そちらも必見です! 見栄えをよくするひと手間①-

          デザインに役立つ!知っておきたい書体の知識とフォント選びのコツ

          デザイナー組織のビジョンとバリューを言語化するプロセスの話

          こんにちは!i3DESIGNの木下です。 いきなりですが、みなさんの所属している組織にはMission、Vision、Value(以下、MVV)はあるでしょうか?全社のMVVは多くの企業が用意しているものの、部署単位となるとどうでしょう? MVVは、会社や組織が自分たちの存在意義を明確にするために必要とされているもので、これから先、より良い組織の形成を目指すために用いられます。MVVを決めることで社外に向けて自社の提供価値を発信できるだけでなく、集団として向かうべき方向性

          デザイナー組織のビジョンとバリューを言語化するプロセスの話

          アイコン付きボタンについて掘り下げてみた

          はじめにこんにちは!i3DESIGNデザイナーチームです。 今回は、UIデザインに不可欠なパーツ、”アイコン付きボタン”についての話です。 「次へ」「確認へ進む」「登録」「削除」など、UIには本当にたくさんのボタンが必要ですよね。 特に、アイコンを入れるとなったら、どっち側に入れる? 毎回矢印アイコンって必要? など検討すべきことも多く、結局なんとなくの感覚で作ってしまうこともしばしばではないでしょうか。 そこで、アイコン付きボタンの作り方について、傾向や考え方をまとめて

          アイコン付きボタンについて掘り下げてみた

          ハンバーガーメニュー右か左か問題

          こんにちは!i3DESIGNデザイナーチームです。 UIデザイナーであれば主にWEBサイト作成時、「ハンバーガーメニュー」を扱う場面が多々あるかと思います。そこで悩ましいのが、ハンバーガーメニューを右に置くか左におくか?という問題です。みなさんも一度はこの問題に頭を悩ませたことがあるのではないでしょうか?そこで、この記事ではハンバーガーメニューを右上・左上のどちらに置くべきか?を考察し、まとめていきたいと思います。 ハンバーガーメニューってハンバーガーメニューとはアプリケー

          ハンバーガーメニュー右か左か問題

          フォームのラベル、必須か任意か問題

          こんにちは! i3DESIGNデザイナーチームです。 みなさん、フォームに必須のラベルをつけるべきか、任意のラベルをつけるべきか悩んだことはないですか? 実際調べてみると、必須ラベル・任意ラベルについての議論は長い間繰り広げられており、色々な見解を見つけることができました。今回はこの「必須ラベル・任意ラベル論争」について調べ、どちらをどのように使うべきなのかまとめました。 必須ラベルと任意ラベルログイン画面や新規登録画面、お問い合わせなどフォームをデザインする機会は多くあり

          フォームのラベル、必須か任意か問題

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #08

          こんにちは!i3DESIGN デザインチームです。 梅雨に入り始めましたね☂️ ジメジメしているのがあまり得意ではないので早く夏が来てほしいと個人的に思ってます👀 少し投稿期間が空いてしまって申し訳ないです💦 さっそくですが第8弾のユーザビリティチェックリストをご紹介します。 ----- 前回の記事はこちら👀 ----- 41.状態が変化するときはアクションの近くで行うアクションに対するフィードバックが離れた箇所に表示されるとユーザーに気づかれない可能性があります

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #08

          チームの結束力を高める!デザインチームの取り組みをご紹介します

          🐣Twitter始めました。弊社デザイナーのTwitterを始めました。フォローお待ちしております! ----- こんにちは。i3DESIGN デザインチームです! この春デザインチームは3名の新卒メンバーを迎えました。 新しいメンバーが増えていく過程でチーム力を向上するためには、メンバー同士がお互いを理解し、認め合うことが大切になります。 そこで今回は、普段私たちがチームの結束力を高めるために行っている取り組みをご紹介します! チームミーティング朝会 週の初めは

          チームの結束力を高める!デザインチームの取り組みをご紹介します

          新卒UIデザイナーに覚えてほしい!ビジュアルデザインの基本とコツ

          こんにちは!i3DESIGNデザイナーチームです。 少しずつ夏が近づいてきましたね。 4月から新社会人や新人デザイナーとして働き出した方は、徐々に職場の雰囲気に慣れてきた頃ではないでしょうか。 今回のnoteでは、そんな若手デザイナーの皆さんに向けたWEB・UIデザインのヒントを集めてみました。 私たちi3DESIGNのデザイナーも日常から意識して行っているものばかりです。 先輩デザイナーが暗黙の了解として行っているコツや、デザインの基本的なルールやセオリーを学んで、さ

          新卒UIデザイナーに覚えてほしい!ビジュアルデザインの基本とコツ

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #07

          こんにちは!i3DESIGN デザインチームです。 桜も咲き始め、気温もあったかくなってきましたね🌸 住む環境が変わり、新しい生活のスタートに心をワクワクさせている方も多いのではないでしょうか。 では、本年度第3弾のユーザビリティチェックリストをご紹介します。 ----- 前回の記事はこちら👀 ----- 36.ボタン/リンクの文言は「押すと何が起きるのか」を明示する 「進む」「続ける」「OK」のような文言は、そのボタンを押した後に何が起こるのか明示的でありませ

          あなたのデザイン力を1ランクアップさせる! ユーザビリティチェックリスト #07