「Atomic Design」（アトミック・デザイン）という言葉がしばしば聞かれるようになってきました。実際にちょっとしたトライアルをしつつ、Atomic Design について考えてみました。
Atomic Designを分かったつもりになる
「Atomic Design」（アトミック・デザイン）という言葉がしばしば聞かれるようになってきました。実際にちょっとしたトライアルをしつつ、Atomic Design について考えてみました。
はるたん / Hal on Twitter: "デザインする上で知っておくこと 1.ユーザーは読まない 2.視覚的なヒエラルキーを作る 3.車輪の再発明をしない 4.導入に頼らない 5.ユーザーは乗り換える 6.ユーザーは急いでる 7.グループとユーザーテストは違う 8.主観… https://t.co/uVu4hgJu4b"
デザインする上で知っておくこと 1.ユーザーは読まない 2.視覚的なヒエラルキーを作る 3.車輪の再発明をしない 4.導入に頼らない 5.ユーザーは乗り換える 6.ユーザーは急いでる 7.グループとユーザーテストは違う 8.主観… https://t.co/uVu4hgJu4b
【深く考えるシリーズ】メルカリの UI がダサい理由を考えてみた。｜あき - 良いもの作って正しく届ける
どうも、UIUX デザイナーのあきです。 先日、メルカリさんがIPOしましたね（IPOの申し込み落選してしまいました、残念）。 ところで最近、非デザイナーの友人から 「メルカリってデザインダサいけど、すごい人気だよね。何がすごいの？」 と聞かれました。 その際、「ちょいダサなデザインだけど、全部すっごいよ」としか回答できなかったので、今回はメルカリの UI について、いまさらですが考えてみました。 また最初に断っておきますと、この記事でお話しするのは「メルカリはダサくてイケてない」や「どこがダサいか解説する」ではなく、「戦略的にダサい UI を採用する勇気と洞察力がすごい」です。 メルカリ関係者の方、誤解招いてましたらごめんなさい。 深く考えるシリーズ 深く考える訓練。気になったことを一切ググらずに考えます。正解不正解ではなく、自分で結論を導き出す訓練。 正解を求める方、ここでお戻りくださ
ケーススタディ：Acornsのモバイルアプリ
SeanはCodal社の技術ライターおよびリサーチャーです。UXデザインからIoTまで、様々な話題のブログを投稿しています。 CodalとUsabilityGeekで長期連載されているUXケーススタディシリーズの次のテーマを選ぶときになると、いつも私は同じ場所を探しています。目的もなくApp Storeをスワイプし、カテゴリをフリックして回り、ダウンロードチャートに目を向けます。また、同僚に「毎日使っているアプリ」、「好きなアプリ」を聞くこともあります。 しかし最近、UXのケーススタディにもっとも相応しい対象を選ぶためには、このいい加減な方法を変えるべきだと気がつきました。アプリをケーススタディ選びの対象として考えるべきではないのです。そうではなく、体験のユーザビリティをレビューする際には、私がレビューするのにもっとも相応しい対象であるようなアプリを選択するべきです。つまり、レビューするた
Webデザインのアイデア満載！創造力をアップさせる最新サイト50選
ウェブサイト制作におけるアイデア出しに困ったときに確認したい、最新ウェブデザインをまとめてご紹介します。 レイアウトや配色、書体などの見た目はもちろん、サイトの雰囲気や印象などデザイントレンドの動向を知ることもできます。さまざまな業種の中から、パーツ別に参考にしたくなるそんなサイトを中心にまとめています。これからサイトを作成しようというひとや、打ち合わせでのきっかけ作りなどに活用してみてはいかがでしょう。 2018年に流行しそうな、注目Webデザイントレンド20個を大予想 Webデザインのアイデア満載！創造力をアップさせる最新サイトまとめ The School of Sustainability 物語を支えたるようにストーリーが進んでいく、まさに体験型のウェブサイト。地図上に表示されたポイントをクリックすると、それぞれのストーリーが動画や音声などを交えて開始されます。 The Greate
熟練デザイナーこそ気をつけたい「コントラスト」に関する3つの話
Webページを閲覧しながら、文字がやや読みにくいな、そう感じたら、コントラスト比が弱いのかもしれません。意外に思われるかもしれませんが、彩度が高いからといってコントラスト比が十分保たれているわけではありません。 普段気にかけない(かもしれない)コントラストですが、コントラスト比が低いと問題も発生します。万人が読みやすいユニバーサルなWebデザインにするには、どうすればいいのでしょうか。 そこで今回は、熟練デザイナーこそ気をつけたい「コントラスト」に関する3つの話をご紹介します。デザイン歴が長くとも意外と見落としがちなポイントもあるので、ぜひ見直しておきましょう。 Webアクセシビリティにおけるコントラストとは？ イメージ画像 / Unsplash *コントラスト比(contrast ratio)*は、一般的に液晶画面について、最も明るい部分(白)と最も暗い部分(黒)の明るさ(輝度)の比率の
Evolution of Android Homescreen and Navigation
For Android’s 10th anniversary, we thought it’d be cool to look back and see how it’s evolved. As you can imagine, the operating system has had quite a transformation since 2008 — the year that Twilight hit theaters and Beyoncé’s Single Ladies was topping the charts. From the beginning, Android has been a powerful platform of innovation and individuality, and that holds true today. Simplicity has
グーグル、「Material Design」採用UIの多様化を促すツールを提供
Googleが「Material Design」をアップデートし、新しい開発者向けツール「Material Theming」をリリースした。このツールによって、開発者がアプリをより高速にカスタマイズできるよう支援する。 新ツールの狙いは、開発者がボタンやナビゲーションに関するGoogleのMaterial Designシステムを守りつつ、ブランドの個々の独自性を反映する特徴を追加できるように支援することだ。 Material Themingツールは既に「Gmail」「Google News」「Google Play」「Google Home」の各チームによって、各製品の機能に合わせてMaterial Designの特徴をカスタマイズするのに使われている。 Material Designは自らの成功に犠牲者になってしまったとの考えを、GoogleのMaterial Design統括者であるM
【2018年版】アプリUXデザインのトレンド12選
モバイルアプリ領域の動きは非常に早く、UXデザインにおいて成功するためには、デザイナーは先見の明を持ち、新たな課題に備えなければなりません。 ここでは皆さんのタスクを軽減するために、2018年において影響力がもっとも大きいであろうトレンドをリストアップしました。 １. ユーザージャーニーの簡略化 アプリやWebサイトを使用する場合、ユーザーには特定の目的があります。その目的を達成するために費やす労力が少ないほど、より良い体験となるのです。 リニアユーザフロー リニアデザイン体験とは、ユーザーが各ステップを１つのアクションで完了できるようにするための開始・途中・終了があるUXのことです。タスクを完了するために必要な時間を見積もることができるため、リニアユーザーフローはユーザーのためになります。
Githubがデザインシステムを作るまでの道のり（前編）
Jerry Cao氏は、UXPinのコンテンツストラテジスト。プラットフォームのワイヤーフレーミングとプロトタイピングを行うためのアプリ内およびオンラインのコンテンツを開発しています。 Diana Mounter氏はGithubのプロダクトデザイナーおよびデザインシステムのリーダーです。 デザインと開発において15年近いキャリアをもつ彼女は、Etsyでシニアデザイナーを務めた後、2015年末にGithubのチームに参加しました。 私たちはこのインタビューで彼女に、デザインシステムにおけるベストプラクティスと、デザインシステムの作成・保守の経験から学んだ教訓について聞きました。このインタビューは、動画で見ることもできます。 また、デザインシステムの利点やプロセスについてもっと知りたければ、無料のeブック『Why Build a Design System？』をダウンロードしてください。 Gi
Material Designを最速で使いこなす｜池内健一
Material Designを使いこなすための最速の手順を紹介します。最近UIデザインを始めた方、iOSアプリのデザインはしていたけどAndroidのデザインも行う必要になった方、WebサービスでMaterial Designを使ってみたい方、Androidエンジニアでデザイン方面ももっと知りたい方などは参考にしてみてください。 Material DesignとはMaterial DesignとはGoogleが構築したUIデザインフレームワークです。Androidだけでなく、WebやiOSのデザインにも活用できます。 ざっくりとした内容は「Material Designとは」でググってみてください。基本理念をわかりやすく解説している記事が並んでいます。この段階ではなんとなくMaterial Designってこんなんだなって理解したら十分です。 それではガイドラインを読み込む前に、まずは準
エラー表示をアートに表現したグリッチエフェクト「 Crashed Glitch Text Effects」
TOP > Design , WebDesign > エラー表示をアートに表現したグリッチエフェクト「 Crashed Glitch Text Effects」 Webサイト閲覧時やゲーム画面などでエラー表示を目にしたことがある人は多くいるかと思います。最近では様々な表現があるかと思いますが、今回紹介するのは、エラー表示をアートに表現したグリッチエフェクト「 Crashed Glitch Text Effects」です。 テキストにノイズや歪みなどを加えて表現されるエラー表示のエフェクトのセットです。 詳しくは以下 グリッチとは映像などの破損により生じる画像の乱れや、ゲームでバグが起こった時の画面の乱れなどのことを言います。グラフィックデザインにおいては、ビジュアルやテキストにノイズや歪みを加えることでレトロな雰囲気を表現したり、エラー表示などに活用されることが多いです。今回紹介し
デザイナーとしての「ゆるやかな死」｜モンブラン｜Designer × VTuber
アダルト業界でデザイナーとして働いていた頃、 あるデザイナーの「ゆるやかな死」を見たことがある。 ここでいう「ゆるやかな死」というのは、 「アウトプットの決定的な低下」のこと。 ▼ 音声で聞きたい方はこちらからお聴きくださいｂ ▼ エースデザイナーの「異変」その人（以後、Nさんとします）は僕が新卒入社する前から、DVDジャケットのデザインを1ヶ月で10点前後作り続けている現役バリバリのグラフィックデザイナーだった。 月で10点は、ジャケット以外の業務も含めれば余裕で週3くらいは残業が必要な量。それをNさんは月に1回くらいの残業で平気にこなす。 言うなればエース、シニアとも言えるデザイナーさんだった。 そんなNさんがある時から変化が生じ始める。 アウトプットのテンプレ化AVは「シリーズもの」が多い。 かの有名な「マジックミラー号」も、様々なシリーズ、企画内容が出ているが、それらをまとめて「マ
2色の相性を簡単にチェックできるカラーツール「Pigment」
デザインで色を決めるという行為は非常に重要なもの。選択や組み合わせをミスしてしまうと、思ったようなデザインに仕上げることができません。今回はそんなカラー選定の際にぜひ役立てたい「Pigment」を紹介したいと思います。 2色の相性を簡単にチェックできるカラーツールです。 詳しくは以下 非常に豊富なカラーサンプルが準備されており、気になったカラーをクリックするとカラーを拡大して見ることができます。DIC、PANTONE、RGBのカラーナンバーも明記されており、そのまま色を再現したり指示するのに便利。また、2色がグラデーションになった際のサンプルや、流行のデュオトーンを取り入れた際のイメージをチェックできたりと、カラー選定＋αの要素が準備されているのも嬉しいポイントです。他、スウォッチ共有用.ase形式などのダウンロードも可能。 オンラインで手軽に色をチェックでき、さらにクリエイティブな想像を
Data Models
Data Models: A Comprehensive Guide to Structuring Information for Optimal Insights and Decision-Making In the realm of data management, the use of effective data models plays a pivotal role in organizing and representing information in a structured and meaningful way. Data models serve as the blueprint for databases, facilitating efficient data storage, retrieval, and analysis. This article delves
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザイン原則の実践｜dely design
Apple、Google、Microsoft、Adobeが共同開発したバリアブルフォントって何？ | Webデザイン、これからどうなるの？（全10回）
「デザイン経営」宣⾔
フロントエンドの制作者が知っておきたい、Atomic Designを使用したコンポーネントベースのUI設計が分かる良書
Vue.jsで作れるオープンソースのUIデザインツール・「Vue Design System」 - かちびと.net