デジタルプロダクトデザインと創作の間にある深い溝
OpenAI API を使ったデザインからコード生成する Figma プラグイン - Gaudiy Tech Blog
こんにちは。ファンと共に時代を進める、Web3スタートアップのGaudiyに、6月からお試し入社する seya（@sekikazu01）と申します。 ここしばらく話題になっている、OpenAI が提供する ChatGPT を代表とした LLM。この記事では、そんな OpenAI の API を使って Figma からコード生成するプラグインを作ってみた過程を記していこうと思います。 先に背景をちょっとお伝えしますと、Gaudiy ではPSFに向けて、複数パターンのUI・機能を実際に提供しながら検証を回すことを予定しています。 すでに定義したコンポーネントはある程度使い回せるものの、ページ実装の試行回数の増加が見込まれる状況です。ここの作業効率化のために、コンポーネントをしっかり活用しながらも、ちょっといじればプロダクション利用可能な React コードを Figma から書き出すトライとし
デザイン素人に贈る、UIディレクション10個のポイント｜ひとし｜note
トレタ代表の中村です。 年末ですね。僭越ながら、今年もアドベントカレンダーの大トリを務めさせていただきます。 今年は何を書こうかなあってずっと悩んでいたのですが、毎年「想い」やら「ビジョン」「意義」やら、同じようなことばかり書いていても芸がないので、今年は趣向を変えてみたいと思います。 テーマは実務方向に振りきって「非デザイナーはどうやってデザイナーにUIディレクションをしたらいいのか」をお題に選びました。ビジネスサイドなど、デザイナーではない人たち向けの記事です。 僕はもともとデザイナーとしての専門的な訓練は受けていないのですが、それでもUI/UXにこだわったサービスを作ろうとすると、どうしてもデザイナーの皆さんとの議論や相談、互いの考えをすり合わせることから避けられなくなります。時には対立することもありますから、このコミュニケーションは本当に大事。 とはいえ経験や知識が乏しいと、デザイ
【デザインファイルを属人化させないFigma活用・コラボ方法】 - Qiita
前提情報 開発環境はスクラム、2週間のスプリントですが、デザインに関しては、レビュー、仕様変更、デザイン修正、サクッと実装、リリース！、ユーザーの声を聞きサクッと修正のようなイメージで基本的に超高速に小回りきかせて、顧客への価値提供は担保しつつ、スピードと顧客の体験重視な対応をしています。そこに前述の9時間の時差と1万キロの距離が加わるので、それ相応の工夫が必要なのは必然かと思います。 これらの前提からFigmaのデザインファイルで実現しなければいけないことは主に4点あって： 1. 最新マスターデザインの場所を明白にする プロジェクト内の構成 以上。 超絶にシンプルですね。単純にこのファイル: Master Design Files の中に、自分が担当しているプロダクトの最新マスターデザインを全部入れています。ルールは”このファイル内で常にデザイン更新する”です。 ファイル内のページ構成
2022年もいろいろUXリサーチの教材をつくったので無料配布するよ！｜storywriter
この記事は UXリサーチ/デザインリサーチ Advent Calendar 2022 の 12月24日 の記事です。クリスマスイブ！ 羽山 祥樹です。日中は某大手企業で働きながら、2年前に日本ウェブデザイン株式会社を起業しました。UXデザインやUXリサーチのコンサルティングやコーチングをする会社です。 ここ数年ずっと、自分のもっているノウハウをひたすら外化して、SlideShareやメディアでの連載記事で「このとおりやれば誰でもUXデザイン・UXリサーチができる」という、具体的でやさしい教材にしてガンガン無償公開する、ということを続けています。 30代の前半に「自分の手元にあるノウハウもお金も自分が死んだら灰になるだなあ。だけど、若い人たちを育てるために遣えたら、自分の命もいくらかは未来に何かを遺したことになるかもしれないなあ」と思いました。それ以来、ノウハウやら何やらできるだけ公開して、
デザイナー発！社内クリエイティブを管理する仕組み作り｜Goodpatch Blog グッドパッチブログ
Goodpatchでは社内業務として発生する 「バナーやブログのアイキャッチの制作」 をUIデザイナーが担うことが多くあります。インターン生や新卒のUIデザイナーがデザインの基礎力を高めるために制作したり、時には案件にアサインされているUIデザイナーが自ら挙手し、業務の合間をぬって制作する場合もあります。 今回、そんな社内クリエイティブ制作に関わるUIデザイナーが、有志で取り組んでいる社内クリエイティブを管理する仕組みをご紹介できればと思います。 これまで抱えていた課題 品質管理の観点からインターン生や新卒のUIデザイナーの場合は、シニアデザイナーやクリエイティブディレクターがレビューを行っています。しかし、これまで明確な制作フローやレビュー項目がなかったため、以下のような課題が発生していました。 それぞれの制作意図を適切に汲み取る仕組みがなく、レビューする際に前提の理解から個別に擦り合わ
努力しないFigmaとの付き合い方
この記事は12月22日に行われた「Figma Design File 大公開！ デザイナー忘年会2022」で話した内容を記事化したものです。 デザインデータは中間成果物 これはこの記事のベースとなる考え方です。僕はデザインデータは中間成果物であり、いつか捨てられる（メンテされなくなる）ものだと考えています。 デザインデータを作る目的はエンジニアやBizDevの人たちとのコミュニケーションを円滑に進めることです。その目的を達成する以上に整っている必要はないと考えています。 また僕は実装されお客さんが実際に利用するアプリケーションの品質が全てだと考えていて、デザインデータをきれいに整えることは時間の無駄になることが多いと思っています。本当に考えるべきことはデザインデータをきれいに運用することではなく、品質の高いUIがきちんとリリースされる仕組みです。 しかしあまりにも無秩序に散らかっているとコ
5年働いていても仕事で"失敗"しているけど元気ですの話｜hassy
デザイナー5年目の年末を迎えそうなhassyです。 先日一区切りがついたプロジェクトにおいて、結構な"失敗"をしたのでそこからの学びを共有するnoteを書きます。 もともと社内のメンバーにむけたLTの内容の移植で、詳細なプロジェクト内容も書けないためかなりフンワリした内容になりますがご了承ください。 前提まず前提として、ここ1年（2022年9月まで）の私の目標は「"デザイナーとして"チームの出す成果をより増幅させられるリーダー・リーダーシップの獲得/形成」でした。 あくまでデザイナーの立場でプロジェクトをリードして、より良いプロダクトをチームメンバーのコラボレーションによって作ろう！といった内容です。 が、せっかく直近のプロジェクトでリードするポジションを獲得したにもかかわらず、それと真逆の結果をさまざまな要因から引き起こしてしまいました。 具体的に、何があったか簡潔に書くと なんだかスケ
コードでデザインをするということ｜Hiroki Tani
この記事は2022年12月10日開催のSpectrum Tokyo Design Fest 2022で話したセッションの内容を文字起こししたものです。 僕は15年ほどWebに関する業界で働いています。はじめは小さなベンチャーでWebデザイナーとして仕事をはじめ、自分でデザインして自分でコーディングするというキャリアからはじまりました。それからフロントエンドデベロッパー、UXエンジニア、デザインエンジニアと肩書を変えてきています。 その中で、CSS設計の書籍の執筆や、Figmaのプラグイン開発、デザインシステムのリードなどの活動をしてるんですが、基本的にはコードを書くことをメインにしつつも、デザインに近い領域で仕事をしてきています。 Code is a Material僕がデザインとコードの両方についての考えを巡らせるきっかけになったのは、2019年に観たデザインシステムのカンファレンスのい
「内省の資質」と「デザイン業務」の折り合いの付け方｜がたまり
これはroot Advent Calendar 2022のDay11記事です。 去年の冬、社内でストレングスファインダーが流行った時期がありました。私も自分について知りたかったのでやってみたところ、一番強い資質が「内省」だった。 前からなんとなく考えを深めないと気が済まない傾向にあるなとは感じていましたが、まさか一番強い資質だとは思っていませんでした。 そもそも内省とはどんな資質なのか。ギャラップの公式サイトに載っていたものをここに引用しておきます。 「内省」の資質が持つ特徴 「内省」という資質は、考える内容に関することではなく、単に考えることが好きだということを意味しています。彼らは自分の考えをさまざまな方向から捉えるのが好きです。強力な「内省」の才能を持つ人は、思考が内側に向いています。（一部省略） クリフトンストレングスの資質「内省®」の紹介ざっくりまとめると、「自分の中だけで熟考し
デザインシステムを使ってプロダクトのデザイン負債を解消する その1｜kchil.design
クックパッドでデザイナーをしているkenjowです。 今回は2022年11月25日に行われた「Cookpad TechConf 2022」で発表した「デザインシステムを使ってプロダクトのデザイン負債を解消する」の内容を紹介します。 村山と見上による「デザインシステムを使ってプロダクトのデザイン負債を解消する」では、過去の歴史を振り返りつつデザイン負債の話と、デザインシステムを導入したことについてお話がありました。デザインシステムを導入したことでサービスの品質が向上したとのことです！ #CokpadTechConf pic.twitter.com/lDJh7dqsIk — Cookpad Tech Life (@cookpad_tech) November 25, 2022 PART1のこの記事では、デザイン負債のお話と、デザインシステムの紹介をします。 また、PART2の記事では、デザイン
副業デザイナーズで作るデザイン組織 / spectrumfest22｜こぎそ
MI-6株式会社の副業デザインチームのリードデザイナー@kgsiです。 このnoteはSpectrum Tokyo Design Fest 2022の登壇シナリオを記事化したものです。発表の補足の意味を込めて公開します。自分の説明不足な点も含めて補足できれば幸いです。 今日はありがとうございます。このセッションでは「副業デザイナーズで作るデザイン組織」というテーマでお話させていただきます。 キャリアやや唐突ですが僕のキャリアの話をします。僕は過去約10年間という、比較的長い期間勤務していた会社がありました。 当時勤めていた会社は副業も禁止で、これから述べるような副業のデザイン組織を作る…などから最も縁遠い位置にいました。 しかしとあるきっかけでその会社を辞め、新しい世界を見ようとしたときに自分の立ち位置や、どんなスキルを持ってどのぐらい社会に通用するのか…解像度がとても低い状態にありました
本質と伝達を横断するBX｜Uzabase SaaS Design Division "DESIGN BASE"
SPEEDAのBXデザイナーの南澤裕文（みなみさわひろふみ）と申します。 ここ最近よく目や耳にするようになったBX（Brand Experience）ですが、みなさんはいつ頃からこの言葉を意識するようになったでしょうか。 今回の記事は、自分がBXを意識するきっかけとなった経験について簡単にお話しできればと思います。 伝達することの大切さに気づいた大学時代もともと私は大学で工業意匠を学んでいました。当時の自分は、コンセプトを考えて形に落とし込むことに注力しており、制作したものを第三者に伝えるスキルが欠けていました。 例えば、読みにくいプレゼンボードのせいでコンセプトの意図が伝わらず、制作したプロトタイプの本質的な魅力を理解してもらえないことなどがありました。 伝達するスキルが欠けている状態こうした経験から、情報を整理し適切に視覚伝達するスキルは、ハードウェア、ソフトウェアに限らずプロダクトの
デザインシステム開発優先度の「難しさ」と「対策」｜hikaru-takase /Loglass
こんにちは、ログラスのデザイナー高瀬です。 今回はデザインシステムの理想と現実について話していきたいと思います。 デザインシステムって素晴らしいけど、いざ実装しようとするとプロジェクトの扱いや開発優先度の調整って難しいですよね？ 今回はそんなデザインシステムにまつわる開発優先度と対策の話をしていきたいと思います。 前提 ・私達は経営管理クラウドLoglassというプロダクトを開発しています ・toB SaaS 視点での見解が多いです ・現在デザインシステム構築中です ・Loglassのデザインシステム構築の中で感じた理想と現実について話していきます デザインシステムは美しくも辛いデザインシステム導入の目的や方法に関して、今では優良なnoteや書籍がたくさんあり私もとても参考にしました。ユーザーの体験・ブランド価値の提供や開発の効率化など、その効能や目的はとても美しいです。 一方でデザインシ
後悔しないデザインシステムの始め方
デザイナーの帽子をかぶったわたしが、プロダクト開発するうえでスクラムチームに提供したいこと / what I want to provide to Scrum teams when developing products
企業の進化に変化をもたらす「融ける“デザインのチカラ”」 | Visional Designer Blog
“Design is too important to be left to designers.” —— デザインはデザイナーだけに任せるには重要すぎる「口紅から機関車まで」さまざまなデザインを手...
エンジニアとデザイナーのコンポーネント品評会｜osanai / ui designer
カンムでデザイナーをしている osanai です。バンドルカードやPoolのデザインを担当しております。 アプリの改善を長年やっていると、デザインにおける一貫性の欠如が発生しがちです。意味合いは同じなのに画面ごとに色やサイズや異なっていたり、用途は同じなのに類似したデザインパターンが複数存在していたり、古いUIが一部の画面で残されたままになっていたり。 このような一貫性の欠如はデザイン負債とも呼ばれ、蓄積するとさまざまな運用コストが発生します。デザインパターンを適用するときにどれが適切か迷う、デザインを変更したときに動作確認すべき影響範囲が広い、本来は不必要なパターンを実装しなければならない、などなど。 今回はデザイン負債解消の一手として取り組んでいるコンポーネント品評会についてご紹介します。 課題コンポーネント品評会で解決したかった課題として、次のようなものがありました。 不必要なコンポ
デザイナーやエンジニアの作業効率が向上するFigmaの運用方法を考える｜osanai / ui designer
カンムでプロダクトデザインをしている osanai です。こんにちは。 前回ご紹介したコンポーネント品評会により、デザインシステムにおけるコンポーネントの課題について議論が進み、不必要なコンポーネントが生まれにくくなり、デザインの意図が汲み取りやすくなりました。 品評会をしていると、しばしばデザイナーとエンジニアで「Figma でもっと効率よくできないかな」という話題が出てきます。例えば「コンポーネントの Variants のパターンをパット見で把握したい」「目的のページやコンポーネントにもっと素早くアクセスしたい」などです。 運用方法に関する課題に対して少しずつ改善に取り組み続け、徐々にですが Figma でのデザインシステムの管理が効率化されつつあります。今回はこれまでに実施した Figma の運用効率化の取り組みをご紹介します。 プラグインで解決編目的のページやコンポーネントに素早く
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
LINE NEWS、没入型の新UIに移行
2023年北海道から10Xのデザインをやります✈️｜mâsa｜note