Webフロントエンドエンジニアにやさしいデザインファイルの作り方 - Qiita
Sketch - The digital design toolkit 画像はSketch最高っていう顔です。 HTMLやCSSを書くWebフロントエンドエンジニアにとって、Webデザイナーが用意した理想像を現実に落とし込むことは1つの使命であり、費用対効果への葛藤に揺れる中で「技術的に難しいから」という理由でデザインを却下したくないのは誰しも同じだと思います。一方で、技術的に難しくなくとも、デザインファイルの作り方次第ではエンジニアの実装効率も多少なりとも変わってきます。そこで、僕のデザイナー及びエンジニアとしての経験則から、HTML/CSSで実装しやすい（≒Webフロントエンドエンジニアにやさしい）デザインファイルの作り方を、Sketchでの用例も挙げつつまとめてみます。近年はFigmaが注目されつつありますが、基本的な話は共通すると思います。 本来ならばデザイナーにこそ読んでいただき
ユーザーインタビューが失敗する理由
ユーザーインタビューは、誤った目的のために使われることが多い。また、計画や分析が適切でなかったり、インタビューを実施する価値をステークホルダーが理解していないこともある。 Why User Interviews Fail by Maria Rosala on June 9, 2019 日本語版2020年2月3日公開 ユーザーインタビューは、UXの重要な生成的手法だ。生成的な手法（インタビューやフォーカスグループなど）は知識を生み出す。一方、評価的手法（デザイン案のユーザビリティテストなど）は仮説をテストするためのものだ。インタビューを適切に実施すると、ユーザーの以下のことを知ることができる： 思考 信念 メンタルモデル エクスペリエンス こうした知識は、良質な製品やサービスの構築に役立つ。また、想像上のものではない、ユーザーの実際のニーズに対処することを可能にする。（デザインを開始する前に
DarkModeのデザインを中心とした色彩設計の考え方 - くらげだらけ
こんにちは、くだくらげです。最近ははじめてのUIデザインという本を共著で書きました。 おかげさまでたくさんの人に読んでいただいて、コメントをもらえたりして嬉しいです。ありがとうございます！ PEAKSさんから出版しており購入できますので、よろしければ手にとってみていただけると嬉しいです。 peaks.cc 概要 WWDC 2019で新しく発表されたiOS13でOSレベルでのDarkMode設定が搭載されることになりました。MacOSの方は以前より追加されていましたが、iOSではなかったので個別のアプリが各々対応していました。 今回、iOSにもDarkMode設定が標準搭載されたことによって、iOSアプリのダークモード対応が必然的に迫られることになって来るのではないかと思っています。 ダークモードを好んで使う人は一定数存在していて、かく言う私もダークモードを好んで使っています。目に優しいだっ
UIのお作法。28個の「〇〇できそう感」をまとめました。｜maiokamoto
UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 １、進めそう感 ２、戻れそう感 ３、進めそう＆戻れそう感 ４、開きそう感（ドロップダウン） ５、開きそう感（アコーディオン） ６、開きそう感（モーダル１） ７、開きそう感（モーダル２） ８、カレンダーが開きそう感 ９、メニューが開きそう感（ハンバーガー） １０、検索できそう感 １１、入力できそう感 １２、検索できそう ＋ 入力できそう感 １３、パスワード入力できそう感 １４、パスワード感（強め） １５、間違えた感（エラー） １６、合ってる感（OK） １７、電話かかる感
住宅建築とソフトウェア開発における問題点の考察｜Megumi Kaneko
私ごとですが、実は戸建てを購入しました。 建売ではなく、間取りや外装は自分で決められる、いわゆる半注文住宅というやつです。とても楽しみにしていたのですが、実は引っ越した今も補修工事が続いています。 その原因が、私が日々携わっているソフトウェア開発で起きがちな問題とあまりに似ていたので、考察を書きたいと思います。 ※特定のハウスメーカーや大工さんを責める記事ではありません。プロセスや関係性に着目して問題提起する記事です。 長いですがぜひ多くの人に読んでもらえると嬉しいです。 事実の振り返りまずは起こった事柄を時系列に並べます。 ・11月5日 設計図FIX＆請負契約締結 ・11月30日 施工着手 ↑ この間、現場監督と大工さんとはコミュニケーション取らず ↓ ・3月3日 中間確認 ▼確認観点・窓の取り付け ・間取りの確認 ▼実際 ・壁や階段がまだついておらず、間取りは確認できず ・とりあえず窓
お給料の3割を必ず資産運用に。「お金」を学び続けたデザイナー、日比谷すみれの2年間 | キャリアハック（CAREER HACK）
デザイナー/プロダクトマネージャーでありながら、FP（ファイナンシャルプランナー）資格を取得！ 日比谷すみれさんが働くのは、資産運用サービスを運営する『クラウドポート』。じつは彼女、もともとは「金融」は全くのシロウト。26歳にして未知の世界に飛び込んだ彼女を待っていたものとは…！？ 26歳、初めてのフィンテック業界 CAREER HACKが、毎月お届けしている『ぼくらの新人時代』。 今回取材したのは、26歳で初めてフィンテックの世界に飛び込んだ、日比谷すみれさん（28）です。 UIデザインカンパニー『グッドパッチ』を経て、資産運用サービスを運営する『クラウドポート』へ。フィンテックにおいては、全くのシロウトだった彼女。 「転職してすぐの頃はワイヤーも用語もちんぷんかんぷん…」 「ただただ、言われたことしかできていませんでした…」 転職当初は、ほとんど新人と同じだったという彼女。 そこから2
デザインシステムに関わるいろいろなプロセスを図にしてみた
今までも何度か デザインシステム に関する記事を書いてきましたが、手段や考え方が中心でした。今回はプロセスに注目して、代表的な課題を図にしてみました。すべてのケースに当てはまるわけではないですが、参考にしてください。 大まかな進め方 「デザインシステムを作りました！」とドカンと発表したほうがインパクトがあるように見えますが、苦労したわりには誰も使わないものになる可能性が高いです。実際はデザインシステムの中にあるものを小さく切り出して少しずつ変えていくことになります。 正攻法であればデザイン原則から始めたほうが良いと思っていますが、組織としてどうあるべきかといった根本的なところが明文化されていないのであれば、そこからスタートしたほうが良いでしょう。デザイン原則があったほうがデザインの議論がしやすくなるので早期にもっておきたいですが、1 日でも早く成果を出したいのであれば、まず色からはじめてみ
Developers.IO 2018 で「API 設計」の話をしてきた #cmdevio2018 | DevelopersIO
緊張すると声がアムロ・レイになる都元です。 ここからしばらく、キャッチコピーの迷走期が始まりますのでよろしくお付き合いください。 さて、去る 10/5 (金) 秋葉原 UDX にて開催された Developers.IO 2018、その中で 「クラスメソッドにおける Web API エンジニアリリングの基本的な考え方と標準定義」 という仰々しいタイトルで1講座持たせていただきました。 スライド 話したかったことと、話したこと 本セッションで話したかったことはだいぶ多岐にわたり、当然 40 分では話しきれないので、当初は次の 2 テーマに絞ってお話しようと考えてスライドを作っていました。 アプリケーション動作ログガイドライン RESTful / リソース指向 API 設計 しかし実際にスライドを作ってみると、それぞれで 40 分の規模となってしまい…。 ログの話は断腸の思いで見送りとさせていた
「量」は、自分を裏切らないーー新人だった私に伝えたいこと｜河原香奈子 | キャリアハック（CAREER HACK）
まずは「当たり前」を｜BANK 河原香奈子 デザイナーの河原香奈子さん。 彼女が手がけたデザインはこのムービーでおなじみの方もいるのではないでしょうか。 即現金化アプリ『CASH』、後払い専用の旅行アプリ『TRAVEL Now』などを手がけるBANK社でデザイナーとして働く彼女。 どうやらはじめから売れっ子のデザイナーだったわけではないみたい。 「当時の上司やクライアントからは『全然ダメ』と言われることも多くて。そして先輩が私のデザインを手直しする。悔しい気持ちと、やるせなさばっかりでした」 もし、あの頃の自分にアドバイスができるなら？ 「どんな案件でもこなしていくこと」 と、晴れやかに答えてくれた彼女。 その新人時代に迫ってみようと思います。 【プロフィール】株式会社バンク デザイナー／執行役員 河原香奈子 多摩美術大学卒業後、制作会社などを経て、2013年に株式会社ブラケットに入社。誰
「DMM.R18」から「FANZA」へ 世界No.1のデザイン企業が挑むアダルトなリブランディング
POPなポイントを3行で 成人向けサービス「DMM.R18」が「FANZA」へと名称変更 新ブランディングを担当したのはSpotify、Nikeを手がけるCOLLINS 担当者のニック・エースが語るアダルトサービスのリデザインとは？ 8月1日、成人向け（アダルト）サービスである「DMM.R18」の名称が、新たに「FANZA（ファンザ）」へと変更された。3月にDMM.comから成人事業を継承された株式会社デジタルコマースが、引き続き運営を担当する。 「DMM.R18」はインディーズAVの配信サイト「DMM」のサービス開始から20周年を迎え、エンターテインメントとしての性をユーザーに提供し続けてきた日本最大のアダルトコンテンツプラットフォームだ。 様々な性的嗜好に対応したコンテンツの豊富さから、一つの文化としても認知される日本のエロ。海外でも「bukkake」や「Hentai」などの日本語がそ
On Survivr Mode
For full Access Subscribe to Brand New Subscription includes Full content. Polls and comments. Full RSS functionality. The Follow-up podcast. The weekly newsletter. NEED SOME CONVINCING? Whether it’s you, your boss or manager, your significant other, your parent, or your HR department that needs some objective reasons to the value of a subscription we have put together a 2-page PDF to help! Alread
UI Sources | Mobile Design Patterns and Interactions
If you're facing payment issues, send me an email at abhinav@uisources.com for alternative methods Real design inspirationBrowse recordings of end to end user journeys from the top grossing apps to reduce iteration cycles, gain insights, identify trends & benchmark against your competitors and industry’s standard. Stop spending time reinventing the wheelAre you and your team spending time figuring
PhotoshopからXD、さらにSketchへ…Atomic Designを実現させるまでにぶち当たったデザインチームの苦悩 | スペースマーケットブログ
PhotoshopからXD、さらにSketchへ…Atomic Designを実現させるまでにぶち当たったデザインチームの苦悩 デザイナーの横井です。こんにちは！ 猫飼いなのですが猫に顔をうずめるのが難しい季節になってまいりました（毛まみれ） 久しぶりのデザイン記事となりましたが、今日は弊社デザインチームが行ったAtomic Designのシステム化の紹介と失敗体験、そしてその道のりを、赤裸々にご紹介しちゃいたいと思います。 既に完成したデザインのコンポーネント化に悩んでいる方々の参考に、少しでもなれば幸いです。 初期のスペースマーケットデザイン ゴリゴリのPhotoshopデザインだった時代 弊社のメインサービスである、スペースマーケットのデザインは約3年前にリニューアルリリースされました。 当時は全てPhotoshopでデザインされ、１ページにつき１ファイル、スマートフォンもPCも別フ
最近のUXデザインにおける、スマホアプリのインターフェイスに使用されているアイデアのまとめ
ここ数年の間に、スマホは単なる電話以上に多くの機能を持つようになりました。スマホはさまざまな目的のために使用され、わたし達の日常のアシスタントをこなしています。 そんな便利なスマホアプリのユーザーインターフェイスに注目し、最近のUXデザインにおけるクリエイティブなすごいコンセプトを紹介します。 15 Creative UX Design Concepts for Everyday Needs by Tubik Studio 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 植物の水やりを管理するアプリ 安眠アプリ ハンバーガーショップのアプリ TODOアプリ 料理のレシピアプリ ベジタリアン用のレシピアプリ アラームアプリ 家電操作アプリ 家計簿アプリ 名刺管理アプリ バランスアプリ ファイナンスアプリ フィットネスアプリ カレン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The Blog | Welcome to Adobe Blog
Connect Digital
LottieFiles: Download Free lightweight animations for website & apps.
UI Movement - The best UI design inspiration, every day
40 Eye-Catching Color Combinations In Display Ads - Creatopy
わざと不便に作られたオブジェクト『The Uncomfortable』 | 100SHIKI
