「1枚のシート」でエンジニアとデザイナーのストレスが激減した話 - Qiita
「考慮もれ」「手戻り」をなくしたい モチベーションクラウドシリーズのデザイナーです。 フロントエンドエンジニアのみなさんは、画面デザインを見て「どう実装するんだ？」とストレスを感じたことはないですか？ 例えば... 👨💻 フロントエンド「Emptyのときはどうするんだろう？最初から考慮してほしいな...（ストレス）」 👩🎨 デザイナー「この状態も考えないといけないのか。確認するだけで1日終わるな...（ストレス）」 →お互いにとって、よくない！！！！！ こうした状態を受けて、お互いにとってストレスなく開発するために、デザイナーとフロントエンドで制作プロセスを改善しました。 今回は、プロセス改善のステップや導入してみて効果的だったツール（シート）についてお伝えします。 【まず初めに】 「UI Stack（状態デザイン）」の必要性の周知 UI Stackとは、UIの考慮すべき5つの
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】UXUIDesignUIデザイン画面設計 1.はじめに エンジニアの私がデザインを本気で勉強した結果、デザイナーとエンジニアはそもそも思考が大きく違っているということがわかりました。 今回は「それ」をデザインに苦手意識のあるエンジニア方にも理解してもらえたらと思い、わかりやすくまとめてみました。 2.アプリの画面デザインを考えてみよう まず、こんなアプリを考えてみてください。 フィットネストレーナーが使うアプリ トレーニングルームでお客様とお話しながら使う 端末はタブレット そして 会員の個人情報確認 前回までのトレーニング状況の確認 次回の予約受付 といったことをします。 使える情報としては、こんな感じです。 あなたならどう画面デザインをするか、もしお時間があったら考えてみてください。
我が Design-Frontend Ops論〜フロントエンド開発を加速するためのデザイン - 仮説編〜｜seya
やはりデザイナーがアレだとフロントエンドエンジニアの生産性も著しく下がり、逆に良ければ上げることもできると思うので、自分が考えてる「デザインの側面からフロントエンドの生産性を考える」というのは割と筋がいいアプローチなのではという想いが深まった — フロントエンド大好きseyaさん (@sekikazu01) June 15, 2021 思いの外反響があり、もっと具体的に聞いてみたい・ディスカッションしてみたいというお声をいくつかいただきました。 せっかくの機会なので、現状自分が考えるデザインとフロントエンドの接合の最適化、カッコ良くいうと「Design-Frontend Ops論」を語っていこうかなと思います。 ※ 予防線貼っておくと、まだ全然実践できていないので話半分に聞いてください。タイトルに"仮説編"とついているのはそのためです。 ※ 一緒に探求してくれる気概あふれるデザイナーも募集
エンジニアがUIにフィードバックするうえで大切にしたい3つの観点｜Goodpatch Blog グッドパッチブログ
UIデザインの現場では、デザイナーとエンジニアの間で様々な問題が起きることがあります。いざエンジニアが実装しようとすると思わぬ矛盾が見つかったり、運用するとき予期せぬデータによって表示が崩れてしまったり…そうしたトラブルは、事前に実装・運用目線からフィードバックする機会があれば防げるかも知れません。そこで今回は、エンジニアが技術的な目線を持ってデザインにフィードバックするポイントをピックアップしてご紹介します。 筆者はWebアプリケーションを専門としており、本稿の内容も基本的にはWebサイト・Webアプリの構築を前提としています。ネイティヴアプリケーションについてはこの限りではない可能性があります。 なぜエンジニアがフィードバックをすべきなのか UIとは実装されて初めて完成されるものであり、実装するうえでの技術的な実現可能性や、デザインが破綻することなく運用に耐えうるか、といった視点で制作
これだけ守れば見やすくなるデザインの基礎
2019/04/18に株式会社gumi様で行ったデザイン講義のスライドです。 デザインとは何か？デザイナーは何を考えてデザインを作っているのか？ という話から、実際にデザインを評価・検討するための言葉を紹介しています。 この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 第二回「UIデザインをはじめよう」はこちら https://speakerdeck.com/kinakobooster/uidezainwohazimeyou 第三回「今日からできるUXデザイン」はこちら https://speakerdeck.com/kinakobooster/jin-ri-karadekiruuxdezain ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life/#/workwith/co
僕たちを超える人を求む！ デザイナーの最高等級２人に聞く理想のデザイナー像 - ペパボHRブログ
社内で２人しかいないデザイナーの最高等級「プリンシパルデザイナー」。１人は、新卒１期生として入社し、2019年４月で勤続９年目を迎えるデザイン戦略チームのしょうちゃん。２人目は、2019年１月に中途入社した同じ部署のこたろっくさん（元グーグルのデザイナー！）。今回はプリンシパルデザイナーの役割とこれから一緒に働きたい人のイメージを具体的に伺いました。 佐藤 咲（さとう しょう） twitter: @satosio あだ名：しょうちゃん 新卒１期生。デザイン戦略チームのプリンシパルデザイナー。最近ハマっていることは、自宅のスマートホーム化。 小久保 浩大郎 （こくぼ こうたろう） twitter: @kotarok あだ名：こたろっく デザイン戦略チームのプリンシパルデザイナー。最近ハマっていることはドラムのブラシ奏法。 現在のチームに所属するまで ー まずはデザイン戦略チームの仕事について
ソリッドとアウトライン、どちらのアイコンが認識しやすいか
アイコンのスタイルをソリッドとアウトライン、どちらを使用するか決めなければならない場合がありませんか？ 好みで決めるという人もいるかもしれませんが、それぞれ分かりやすい場合と分かりにくい場合があります。 どのような場合にソリッドを使い、アウトラインを使うとよいのかを紹介します。 ちなみに下記は、左が過去のデザイン手法、右が現在のデザイン手法です。 Solid Vs. Outline Icons: Which Are Faster to Recognize? by UX Movement 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 アイコンのスタイルがユーザビリティに与える影響 アイコンにおける特徴的な手がかり アウトラインアイコンが速い場合 ソリッドアイコンが速い場合 スタイルに違いがない場合 ボタンとしてのアイコンを使用す
Appleに影響を与えた伝説の工業デザイナー、ディーター・ラムスの「いいデザインの10か条」 - GIGAZINE
iPhoneをデザインしたAppleのデザイナー、ジョナサン・アイブ氏にも影響を与えたといわれる伝説の工業デザイナーであるディーター・ラムス氏は「いいデザインの十か条」を提唱しています。ラムス氏と「いいデザインの10か条」を映画監督のゲーリー・ハストウィット氏が映像化した「Dieter Rams’ 10 Principles of Good Design」が無料公開中です。 Rams — Gary Hustwit https://www.hustwit.com/rams 「Dieter Rams’ 10 Principles of Good Design」は以下から見ることが可能です。 Dieter Rams’ 10 Principles of Good Design on Vimeo 「全てのものは相互作用し、同時に他から独立しています」というラムス氏の言葉と共にムービーはスタート。 「
フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと｜Pittan｜note
フロントエンドエンジニアとデザイナーさんは日々協力してプロダクトを作っていく関係にあります。デザイナーさんが作ってくれたものをエンジニアが素早く実現できるよう、いくつかエンジニアから意識してほしいことをまとめました。 なんでこんな話になったのか（前置きなので次の章まで飛ばしてOKです） デザイナーさんから「この画面をこんな風に作ってください」とXDやSketch、PSDなどいろいろな形で渡されることがあると思います。 僕の個人的な意見・経験ですが、いざ実装するぞとなったときに 「あれ…ここってどうしたらいいんだろう？」 と迷って作業のスピードが落ちてしまうことがとてもストレスに感じていました。できればノンストップでいきたいなあと思うわけです。 手が止まるたび、デザイナーさんに「ここってどうしたらいいですか？」と質問するのが何か新しい画面を作るときに必ず発生していました。 「（いつも聞いてる
2018年に待ち受ける５つのUIトレンド
Emilyはイングランド出身で、大学でフランス語とドイツ語を学んだあとベルリンに移住しました。CareerFoundryで執筆していないときは、旅行やフラフープ、読書を楽しんでいます。 2018年のUIデザインの世界には何が待ち受けているのでしょうか？ 冒険好きなデザイナーの皆さんには、朗報です。2018年は反乱の年になるでしょう。UIの限界を超え、既存のルールを破り、リスクをとるべきときなのです。 ここでもっとも重要なテーマは、「Big and bold」です。これは、フルスクリーン表示、大胆さ、全体の没入感に関係しています。 しかし、上位５つのトレンドを紹介する前に、2018年、そしてその先のUIを形作るものは何か見てみましょう。 仮想現実（VR）と拡張現実（AR）は、これからのUIにおいて大きな役割を果たすでしょう。INADEV CorporationのVikrant Binjraj
ノンデザイナーでもイケてるLPを作成する方法 - Qiita
はじめに イケてるは誇張かもしれませんが社内にデザイナーがいなく、 エンジニアにランディングページを作ってと振られたときのケースを想定して ノンデザイナーでも体系的にCSSコーディングすることでそれっぽいランディングページを作成できることを目的としてます。 デザインは一朝一夕でできるものではなく、ブランディングに関わる部分の画像に関しては、商材の撮影やPhotoShopやIllustratorで専用のアイコンやロゴ画像を別途制作する必要があります。 本格的に作成する場合はやはり本職のデザイナーさんに依頼した方が良いでしょう。 （それっぽいといったのは今回はそれらのブランディングに関わる画像の作成を省いて、素材画像やCSSでごまかしているからです。） 今回はCSS Designerという仮想CSSエディターの商材を想定してランディングページを作成しました。 作ったページ全体のサンプルはこちら
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今日からはじめるデザインレビュー