デザイン系note集

エンジニア直伝！デザイン&実装の両観点で最適な「積むUIレイアウト」の制作方法

こんにちは、@ShikiCheriです。現在フリーランスのUIUXデザイナーをやっており、単発案件ではなく長期的に組織や事業にコミットするような形で、サービス開発のデザインを中心に担当しています。デザインシステム構築を担当したことでUIデザインの最適解について目から鱗が落ちた…！？クックパッドは25年のサービスの歴史があり、特にWeb版は今でも現役で活用されているサービスです。私はこの長寿サービスWeb版クックパッドのUIのリニューアルを行いました。またこのプロジェク

君がひとり目のデザイナーなら今すぐデザインデータをデザインするべきだ

一般的にデザインデータをデザインするタイミングはいつなんだろう？ 2人目のデザイナーが入ってくるタイミング？ぐちゃぐちゃのファイルに我慢の限界がきたエンジニアに声をかけられたタイミング？もし君がデザインの価値を信じているなら、今すぐデザインデータをデザインしよう。この記事ではデザイナーがひとり（または少人数）の時からデザインデータのデザインに投資すべき理由とその方法、そしてそこから得られるものについてお話しします。より具体的な方法に関しては、すでに素晴らしい記事がい

Figmaのリファクタリングからはじめるデザインシステムの構築

こんにちは、GaudiyデザイナーのTORAJIRO（@jirosh1998）です。『英単語アプリ mikan』の副業デザイナーとして、Figmaリファクタリング&デザインシステムの一歩目を構築した話を書こうと思います。このnoteの最後に、今回作成した『mikan DesignSystem』のデータを公開していますので、ぜひご覧ください👋（mizoさんをはじめmikanのみなさん、具体的なアウトプットの公開まで許可いただき感謝です！心広すぎ！）デザインシステム本

デザイントークンって何？

「デザイントークン」最近はよく使われている言葉だと思うのですが、意外と日本語での情報がないのでまとめてみました。 W3C の定義実はデザイントークンには W3C という標準化団体でのワーキンググループがあります。これが絶対の定義と思う必要はないと思いますが、共通の定義としては便利だと思うので引用するとこの W3C ではという定義がされています。実態としては至極シンプルなものですが、もっと分かりやすくするために具体例を見てみようと思います。上記では色の値とそれに

FigmaのSlotを活用したらデザインシステム管理が超絶楽になった話

いつも大学や英語の勉強についての記事を書いてますが、今回はデザイナーとして働いている私が知った技術的なことについてまとめていきたいと思います。改めて軽く自己紹介昨年の11月よりファインディ株式会社でUI/UXデザイナーとして働いております。ファイディで働くのはとても楽しく、また周りの優秀な人達に囲まれて自分もメキメキと成長を感じています。（ここに関しては入社半年エントリー記事で詳しく書く予定）普段はプロダクトの魅力を高めるために様々な取り組みを行っています。その中でも

SmartHRのプロダクトデザインの生産性を高める“デザイン”のためじゃないデザインシステムとは（Schema2022）

こんにちは。 SmartHRでプロダクトデザインをしている@wentz_designです。本記事は、2022年11月2日に開催された「Schema by Figma 2022 Tokyo」で発表した「“デザイン”のためじゃないデザインシステム」のスライドを元にした内容になります。早口で話して20分くらいかかる内容になりますので、お時間のある時に読んでみてください。また、記事に構成する上で文字だけのスライドなど一部を省略していますが、全スライドはFigma Comm

スキ・キライ・得意・苦手を可視化したら、互いに成長を支え合うデザインチームができた話

クックパッド VP of Design／デザイン戦略本部長の宇野です。みなさんは苦手なスキル、得意なスキルをどのように把握し成長につなげていますか？今日はそんなお題に向き合ったクックパッドでの取り組みをご紹介します。僕が今年2月に入社したとき自身の自己紹介資料に入れた簡単なチャートがあります。それがコレ。スキルマップって基本的には「得意」を可視化するためにあります。でも「得意」だから好きとは限らない。「苦手」だけど好きだってある。それを可視化するために「得意／苦

60人以上のインタビューから価値と体験を具現化するためにデザイナーが行ったこと

クックパッドデザイナーのよーた（@yotaszk）です。このnoteでは、3ヶ月間で60人以上のユーザーさんにインタビューにご協力いただきながら「クックパッド」アプリトップのリニューアルを含んだ大施策の具現化のためにやっていた、Figma活用術を紹介します！事例：クックパッドアプリの新しいアプリトップとテーマ体験新しいアプリトップとテーマは、ユーザーさんが料理の趣味嗜好ごとにレシピをまとめられる仕組みで、検索だけでは出会いにくいレシピとの「偶然の出会い」を作ります（

フォローしませんか？

#figma