エンジニア向け デザイン基礎（社内勉強会の資料） - Qiita
これは何 私が所属している株式会社エイチームでは社内勉強会を自由に開ける制度があります。 エンジニア向けにデザインの基礎をレクチャーする会を開いたのですがせっかくだったらオープンにしようと思い、投稿しました。 今回の勉強会では「Webサービスを作る」レベルまでは踏み込めませんでしたが、ちょっとしたUIを作る際の手助けにはなれる気がしています。 なお、勉強会用に書いた原稿なので書き言葉としてあまり適切でない箇所もあります。 ご了承ください。 また、この研修の次の年に行った研修も記事として投稿しています。 設計の話 はじめに：デザイン業務の内訳とよくある誤解 デザイン業務の内訳 まず最初に設計の考え方をレクチャーするのですが、その前に1つ。 普段デザイナーが行っている業務について簡単に説明します。 後の方で話す内容と繋がってくるので、ちょっと本筋から外れますが聞いてください。 話を分かりやすく
【レビュー/デザインレビュー(DR)とは】技術職の打ち合わせにはどんな種類がある？長い？
意味もない打ち合わせがダラダラと長く続き、しかもそれが何回もある。仕事してて最もイヤなことの１つですね。激しく共感できます。 というわけで「技術職だとどうなのか？」について色々書いてみる記事。 長さの件だけでとりあえず結論を言うと、別に長い会議はいくらでもあります。 会議の質は人に依存するので、どんな業種のどんな会社だろうが内容は千差万別でしょう。ここをひとまとめにすることは何の意味も持ちません。 ちなみになんで「会社に打ち合わせがあるか」という哲学に近い命題に対する僕の意見はこうです。 「なぜアホみたいな打ち合わせがなくならないのか」という永遠の命題に対する僕の最新の見解は「やつらはとりあえず集まることによって互いに仕事しているアピールをするための場を互いに作り上げようとしているのでは」なんですけどいかがでしょうか — みるみ - みるめも (@milmemo_net) October
『UXデザインの法則』と『行動を変えるデザイン』を読む。｜相島雅樹｜note
ネットワーク効果のための行動変容デザイン 概要単にサービスやプロダクトの効果を高めるだけでなく、もっとプロダクトやサービスを使ってもらうために、行動変容デザインの考え方を活かすには、ネットワーク効果を生む行動変容を設計する必要があります。しかし、行動を変えるプロダクトやサービスは、単に利用目的を満たすことにのみ注力しがちで、その影響力を拡大するために行動を変えるデザインの力を活かしきれていない、ということが多いように思います。 いかにネットワーク効果を生み出すか、そのために行動変容デザインをどのように活かせるのかを
DODO DESIGNのアートディレクターの育て方 | Visional Designer Blog
ビズリーチのコミュニケーションデザイン室では、「明日から活用できる引き出し」をテーマに、デザイン業界の第一線で活躍されているさまざまな方を講師にお招きし、業務やキャリア開発に生かす勉強会をはじめました...
デザインを巡る疑念・怨念集：「UI/UXデザイナーって要はwebデザイナーだろ？」ほか｜サカキバラ・ケイ
デザイン界の池上彰とかいたらいいのになあ。と最近よく思います。それくらいデザインを巡るモヤモヤに出くわします。人から訊かれたりもします。僕デザイナーじゃないのに。でもメシアをただ待っていてもしょうがないので、自分で考えることにしました。 世の中で耳にする疑念・怨念のうちいくつかを以下に挙げていきますが、それに対するコメントの多くは僕個人の独自見解であって必ずしも社会的合意に沿った記述ではありません。なので「そういう考え方もあるよね」「わかるわかる」「えー？そうかなあ...」みたいに昼過ぎのワイドショーを見る感覚で読んでいただきたいです。 その1：UI/UXデザイナーって要はwebデザイナーだろ？僕もそう思います。 素晴らしいUI/UXデザイナーは確かに存在します。そういう人はマジで神だと思います。ただ、UI/UXという言葉の語義に忠実に沿えば、なにもパソコンやスマホの画面だけがユーザーのイ
Neumorphism: 令和時代のスキューモーフィズム - Qiita
※この記事はデザインのトレンドを紹介する体で書かれた技術記事＆ライブラリの宣伝となっています。あらかじめご了承ください。 tl;dr; みなさんはNeumorphismという単語をご存知でしょうか？ これは次に流行るとちらほら言われているデザインのトレンドで例えばこんなものです。 Neumorphism in user interfacesより 少しスキューモーフィズムのようなリアル感があるのがわかるでしょうか？ これは命名もnew + skeuomorphismから来ているそうで、そこまでリアリティを追求しているわけではないんだけど、フラットやマテリアルよりもっと質感を感じられるようなデザインとなっています。 これはかっこいい。ですが、実装はどうやるのか？気になりますよね。 そこで今回はこのNeumorphismをiOSネイティブで実装するにはどうすればよいのかについて紹介していきます。
デザイン経営トレンドを振り返る デザイン会社 ビートラックス: ブログ
2019年を締めくくるにあたり、経営におけるデザインの与えるポジティブインパクトについて、まとめてみたい。アメリカ西海岸をはじめ、多くの企業がすでにデザインの恩恵を受けているが、まだまだその数は少なく、世の中のビジネスの大半は、その重要性をいまだ実感していない。 数字で表される経営に対するデザインの力米国のコンサルティング会社Motiv Strategiesによると、デザイン的考え方を経営に積極的に取り入れている上場企業16社は、その株価の伸びがS&P 500全体と比べ2003年から2013年の10年間で228%高くなっているという統計を発表した。 ちなみに、このDesign Value Index指数におけるDesign-centric Organizationに選ばれるための評価項目は下記の通り: 過去10年間で上場している経営とマネージメントの根幹にデザインを活用してるデザインに関す
もうUIデザインのバージョン管理をサボるのはやめよう | Web Design Trends
UIデザインツールで作ったファイルのバージョン管理をきちんと行っていますか？バージョン管理を行うことによって、作業の内容が明確になり、チームでのデザイン制作が効率的になるというメリットがあります。 ツールの料金を払いたくないから見送っていたという人も、Githubを使えば無料でバージョン管理が行えます。 エンジニアはGitによるバージョン管理がすでに一般的な習慣として定着していますが、UIデザイン制作でも同様にバージョン管理を行うことが一般的になりつつあります。 今回は、デザイン制作の主要バージョン管理ツールとその特徴についてご紹介したいと思います。 バージョン管理ツールとは バージョン管理ツールとは、デザインツールなどでデザインを制作したり編集した時に、それぞれの変更内容を管理するためのツールです。 エンジニアは当たり前のようにプログラムのコードのバージョン管理を行っていて、それによって
PMにデザインツールの使い方を共有したら、作業効率と精度が飛躍的に上がった話。｜Mercari Design Blog
こんにちは、メルペイデザイナーの東野です。 デザイナーの皆さんは、普段の業務でディレクターやPM（プロダクトマネージャー）とのやりとりをどのように行っていますか？ 私たちのチームでは、デザイン・ワイヤーフレーム作成ツールとして、Sketchを使っています。そのため、Sketchを介して、PMとデザイナーがコミュニケーションをとる場面が多くなります。 そんな中、PMのとある一言がきっかけとなって、Sketch共有会を開くことにしました。今回の記事ではそこからの学びを共有します。 きっかけの一言きっかけはPMから、思いもしなかった一言を聞いたことでした。 まず、シンボルを解除することからはじめます Sketchをご存じない方にとってはなんのことやら？ですが、シンボルというのは、デザインの骨格にあたるパーツのようなもの。それを解除してしまうと、デザインの基盤が崩れかねません。 ツールの使い方を我
社内システム特化なデザインシステムのメリット 〜 ヤフー社内のデザインシステム紹介
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。ヤフーで社内システムを担当しているデザイナーの伊藤、今河です。 前半では社内システムをデザインするデザイナーの環境と事例紹介を取り上げました。 後半では、私たちが運用しているデザインシステム「SAYA」について詳しくご紹介します。 SAYAとは SAYAとは、主に社内エンジニアが開発で使用するシステムのために作られたデザインシステムのひとつです。 多様なテーブルの表示形式や豊富なフォームパーツ、高情報量に対応する省スペースオプションの提供など、システム特有のUIにフォーカスし、社内エンジニアにとって最適なユーザビリティーを実現します。 ヤフーの従業員なら誰でも利用できるよう、デザインデータとコード、およびロゴデータなど
Design Systemへの取り組み 〜Frontend編〜 | メルカリエンジニアリング
この記事は、Mercari Bold Challenge Monthの1日目の記事です。 こんにちは、MercariのArchitectチームでDesign Systemに取り組んでいる@usagi-fです。 Design Systemはただのスタイルガイドラインではなく、会社として保持するデザインフィロソフィーから実装コードに落とし込まれたUIコンポーネントまで、広い範囲をさす言葉として認知されてきています。 現在私たちは本格的に構築へ着手しており、少しずつ進捗が見えてきました。この記事では主にDesign Systemにおける「UIコンポーネントの定義と実装」の部分に焦点をあて、私が担当しているWeb Frontendの事例を紹介していきます。 MercariにおけるDesign System Mercariでは将来的な組織規模の拡大に向けて様々な取り組みを行っていますが、Design
デザイナーがwebサイトを模写する際に見るべき8つの学習ポイント｜Tomoyuki Arasuna
webやアプリのUIデザイン上達のコツとして、模写（コピー）がよく取り上げられます。私も過去に一時期やったことがありましたが、確かにいくつかのデザインを細かく観察して自分で再現してみることで、その後いざ実践！となった時に多くの学びを活かせたと記憶しています。 そうした経験から、最近も会社の若いメンバーに模写を進めて実践してもらっていたのですが、とあるメンバーから「模写はできたものの、どんなところを観察すればよいのでしょうか？」という質問を受けました。確かに、実践経験が少ない人にとっては、真似てはみたもののそこから何を学べばよいか分からない、というのは当たり前かもしれません。 模写というと変わったレイアウトや表現ばかりにとらわれがちなのですが、本当に身に付けたいのは「使えるwebサイト」を作る上でのデザイン力の基礎部分です。その基礎とは何か？を知ると学習の効率も上がります。そんなわけで今回は
デザインを学ぶときに意識したい5つのこと｜Goodpatch Blog グッドパッチブログ
デザインを学び、デザインができるようになるのは容易ではありません。 デザインといっても様々なジャンルや専門性があり、何から手をつけていいのかわからないことも多いのではないでしょうか。 この記事では、これまで私が様々なデザインを学んだり教えてきた中で、共通する意識したいこと5つをまとめています。 これからデザイナーを目指す方、デザインを学んでいる最中の方、誰かにデザインを教えている方の参考になれば幸いです。 1. 勉強ではなくスポーツ みなさんはデザインを学ぶといえば、どんなイメージをもつでしょうか。本を読んで、勉強するイメージを持たれる方が多いのではないでしょうか。 たしかに、デザインにもある程度知識は必要です。しかし知識を得るだけでは、デザインができるようにはならないのです。 これはスポーツをイメージするとわかりやすいので、スポーツの例で考えてみましょう。野球の未経験者が、バッティングに
Webサイトのメインビジュアルの構図を集めて分析してみた。｜ameko
初めまして、ameko(@tk04amedama)と申します。 普段は都内の制作会社でWEBデザイナーをしています。 と言ってもまだまだ新米なので、日々勉強中です。 その勉強の一環で、最近のWebサイトで使われている メインビジュアルの構図を一覧にしてまとめた画像をTwitterに投稿してみたところ、思いがけず多くの方に反応いただけたので、その後に行っていた構図ごとの分類分けや分析も公開してみようと思い、初めてnoteに投稿してみました。 はじめに集めたサイトの数は全部で７０個。自分の仕事の参考のために集めたものなのでほとんどがBtoB向けサイトです。（BtoC向けサイトだと、この構図一覧もまた、全然違うものになりそうだなと思う。） 構図の名前は、なんとなく自分なりに語呂がいい名前をつけているだけなので、あまり突っ込まずふんわり流していただけると幸いです。（もしこの構図の正式名称とかあった
有名建築家が設計したおしゃれなホテルのおすすめ14選
こんにちは。 今回は有名建築家が設計したおしゃれなホテルのおすすめ14選です。 国内には安藤忠雄氏や隈研吾氏などの有名建築家が設計した様々なデザイナーズホテルがありますよね。 そこで、今回は有名建築家が設計したおしゃれなデザインのホテルのおすすめをまとめました。 ※当サイトはアフィリエイト広告を利用していますが、当サイトが独自に作成した記事であり、第三者から依頼を受けたものではありません。 有名建築家が設計したおしゃれなホテルのおすすめ！ここからはいよいよ、実際に有名建築家が設計したおしゃれなホテルを見ていきましょう。 瀬戸内リトリート 青凪 瀬戸内リトリート青凪（せとうちリトリートあおなぎ）は、愛媛県松山市柳谷町にあるホテル。 青い空と海に身をゆだね、凪に静を知る「MINIMAL LUXURY」。 安藤忠雄、建築・設計のホテル。 オールスイート、全7室のラグジュアリー・ホテルです。 wi
ブランドビジョンの整理の仕方｜灰色ハイジ
最近ブランディングってどうするんですか。立ち上げ時に何をしたら良いですか。という質問を受けることが何回かありました。自分はこうやっているなぁということをいくつかまとめてみました。あくまで私のこれまでの経験の中に基づいており、主にアプリなどのデジタルプロダクトを立ち上げる時に行っていることを書きました。 そもそもブランドとは ブランドとは何か？という質問を受けた時に私はよく「ブランドとは人のようなものです」と返しています。友達のような存在なのか、あるいは家族のような存在なのか。一緒にいて楽しくしてくれる人か、助けてくれる人か。 ブランドのファンとなってくれる人にとって、どんな存在になって欲しいかをクライアントやチームと一緒に考えます。 ブランドを表す言葉を集めて整理する私は「キーワードとしてブランドビジョンを整理する」という手法を好んでいます。ブランディングが及ぶ範囲はとても広範囲で、想起し
わからないことに立ち向かう方法を想像することをデザインという｜棚橋弘季 Hiroki Tanahashi
実は、「正しさ」なんてものを信用したことは一度もない。 何かがその時々の状況に応じて「適切である」ことはあって、その選択がその条件のもとで正しいことはあっても、何かが無条件に正しいなんてことはないと信じている。 だから前回「牛、蜂、そして、百合の花」で書いたような、古代エジプト人たちが「変身」という思考装置を用いて世界を理解していたという話にしても、いまの僕らにとってはまったくもって「あり得ない」ことだとはいえ、その思考が「正しくない」なんてことはないと思うし、その思考は十分その条件下においては論理的だし「正しい」。 そういう思考のオルタナティブを示してくれるからこそ、そうした過去の人類の信仰や文化に触れたりすることは楽しい。自分たちがいかに凝り固まった考えに囚われているかに気づかせてくれるから。 それに、現代の僕らの判断だって、状況をどう捉えるかによって、一見「正しい」と思えるものが「正
フレームワークと共存できるデザインの向き合い方
フレームワークはクリエイティブを殺すのか プロダクトやサービスを運用しているサイトの多くは上図のようなフォーマットに収まります。画面上には大きな画像（又は動画）を背景に短めのメッセージ。3, 4 つの機能紹介、導入している企業のロゴが並ぶといった構成はよく見かけます。似たようなテンプレートがたくさんあるように、定番になっていると言えるでしょう。 こうした無難な形状をした web サイトを「Bootstrap っぽい」と表現することがあります。2011年にリリースされて以来、フロントエンドフレームワークとして多大な影響を与えた Bootstrap。模索・実装の敷居を下げたものの、同じような見た目の web サイトを量産したことを指摘される場合もあります。 フロントエンドフレームワークやデザインシステムのような『枠組み』に沿って作ることはクリエイティビティを奪うものだと危惧している方は少なくあ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
このデザインのエラーはどこ? 商品パッケージの記号やセオリーに着目した『なんか、ちがう。パッケージデザインのやくわり展』が面白い
いちからデザインシステムを作ってみて学んだこと
