デザインシステム知見まとめ

本

noteにある様々なデザインシステムの知見をまとめていくマガジンです。良い記事を選定してくれる運営メンバーも募集中です。

運営しているクリエイター

#デザイナー

日本・海外のデザインシステム総まとめ【56事例＋α】

こんにちは！株式会社Rabeeの新人デザイナーのakaneです🏋 今日は、WEB上に公開されているデザインシステムをとにかくたくさん集めました。業種や規模、国内外の企業問わず、デザインシステム（スタイルガイドも含む）と名の付くものを、見つけられた範囲ですべて収集しています。多数のデザインシステムの比較・検討をしたい際など、データベース的にお役立ていただけたら幸いです。 ※以下の目次、異次元の長さになっています。開く際はご注意ください…🐲 はじめに🗒掲載方法について

クロンデザインシステムのカラーパレットをリニューアル

オンライン医療事業部プロダクトデザイナーのL.Tです。久々の投稿ですが、今回は自社プロダクト「クロン」のデザインシステムのカラーパレットをリニューアルした話をお伝えします。 AS ISのカラーパレットの問題点以前から社内デザイナーからクロンデザインシステムにあるカラーパレットについて、いくつか改善リクエストが上がっていました。具体的には、彩度（Saturation）が揃っていない（同じ色相内で鮮やかなもの、鈍いものが混在）全色並べた時にグラデーションレベルが

「デザインシステム」って何？新人WEBデザイナーがインターネットの海を泳いでみた

はじめまして！株式会社Rabeeの新人デザイナーのakaneと申します。元々はWEBメディアの編集者をやっていましたが、昨年の秋に未経験からWEBデザイナー（UIデザイナー）に転職しました。デザイナー歴4ヶ月。日々新鮮な気持ちで働いています💪 はじめにこの記事は、かけだしデザイナーの目線で「デザインシステムって何？」の疑問に向き合った記録です。ちょっぴり長い記事ですが、私と同じような新人デザイナーに楽しんでもらえたら嬉しいです！最後に参考記事も紹介しているので、ぜ

デザインシステム改善:デザイナーとエンジニアで一緒に進めるコンポーネント整理

こんにちは。ヤフーメディア統括本部企画デザイン本部デザイナーの芦田です。3年前にヤフートップページのデザインシステム導入を担当した経験を活かし、現在担当しているサービスにおけるデザインシステムの改善を進めてきました。改善の中でも、デザイナーとエンジニアが密接に連携して進めたコンポーネントの整理は、特に大変だったものの、多くの学びがありました。今回は、そのコンポーネントの整理をどのように進めたかを共有します。デザインシステムとはデザインシステムは、デジタルプロダクト

知る・触れる・楽しむ carbon design system と design system

はじめにみなさん、こんにちは。いつもIBM UX Communityをご覧いただきありがとうございます。 IBM UX CommunityのUXデザイナー、前壮一郎です。現在、IBMの新しく立ち上がった部門ICE（ IBM Client Engineering ）でUXデザイナーをしています。近年、デジタルプロダクトの世界は急速に進化しています。ユーザーはますます高い期待を持ち、多様なデバイスやプラットフォームを通じてシームレスな体験を求めています。私は、この複雑

どなたでも利用できる、イラストレーション・アイコン素材集を配布します

デジタル庁では、行政手続をわかりやすくするためのイラストレーションやアイコン素材集の制作をおこなっています。 2023年の始めにプロジェクトが発足し、これまでデジタル庁の四半期報告会見資料や、重点計画資料で活用をおこなってきました。これらの素材集を、府省庁や自治体、事業者の方々など、どなたでも活用ができるように配布をはじめます。 Figma Communityで公開しているデジタル庁デザインシステムから、ウェブやアプリケーションで利用ができる素材を6月中に配布開始予定です。

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

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

デザイナーチームからデザインチームへ！ユーザー体験を最高にするチームへの生まれ変わり

こんにちは！kintone Design Teamのsakito(@__sakito__)です！私は2023年1月からkintone Design Teamのチームリードやプロダクトのデザインプロセスなどを考えることになりました。その中の1つとしてkintone Design Teamの構成を大きく変更しました。今回はチームの構成を変更した経緯や課題だったこと、変更してから感じている手応えを紹介します。似たような課題を抱えている方の参考になれば幸いです。チーム

kintoneのデザインシステムを作る「Mantleチーム」とは？（後編）#CybozuDesignPodcast

オープニング（00:00）Tobi／皆さんこんにちは！デザイナーのTobiです。この番組はサイボウズデザイン＆リサーチグループのメンバーが日々の活動や取り組みを雑談形式で紹介するコンテンツです。デザイン・リサーチ・アクセシビリティを軸にサイボウズデザイン&リサーチグループの今をお届けしつつ、メンバーの人柄やチームの雰囲気をお伝えします。 Tobi／今回はkintoneのユーザー体験を最高にする活動をするチーム、Mantleチームの紹介の後編となります。前回はMantleが

Spectrum版 minneのブランドを反映したイラストができるまで

こんにちは。GMOペパボ株式会社の「minne」というサービスでデザイナーをしている sziaoreo です。minneのブランディングとアートディレクションを行っています。 minneとは？minneは、国内最大級のハンドメイドマーケットです。アクセサリーやファッションアイテム、インテリア雑貨などだけでなく、食品や時を超えた技術が詰まったヴィンテージのアイテム、さらなるものづくりを促す素材や、手作りキットなどが売り買いされています。そして自分の手だけでつくることはもち

デザイナーやエンジニアの作業効率が向上するFigmaの運用方法を考える

カンムでプロダクトデザインをしている osanai です。こんにちは。前回ご紹介したコンポーネント品評会により、デザインシステムにおけるコンポーネントの課題について議論が進み、不必要なコンポーネントが生まれにくくなり、デザインの意図が汲み取りやすくなりました。品評会をしていると、しばしばデザイナーとエンジニアで「Figma でもっと効率よくできないかな」という話題が出てきます。例えば「コンポーネントの Variants のパターンをパット見で把握したい」「目的のページ

２週間で爆速整備したデザインシステムと運用ルールを公開

こんにちは、カウシェDesignerの@Kana Kikuchiです。サービスのデザイン運用って難しいですよね。カウシェはリリースから約2年が経過するプロダクトですが、つい1年前まではデザインシステムやFigmaの運用ルールがおざなりの状態でした。そこで今回は、そんな適当デザイン運用から、ある程度の運用ルールが整うまでの怒涛の2週間について記載し、整備したデザインシステムやFigma運用ルールをご紹介したいと思います！なぜやったか1人でデザインしていたカウシェに

デザインシステム構築におけるオーナーの重要性

こんにちは。ユーザー体験を最高にする活動をしているチーム、通称 Mantle チームのプロダクトオーナー(PO)をしている sakito です。 Mantle チームでは、ユーザー体験を最高にする活動の 1 つとして kinotne のデザインシステムを作っています。この記事では、デザインシステムを作る上での PO の役割や、PO がいることによる効果を実際の事例と合わせて紹介します。デザインシステムは成長するものデザインシステムは作って終わりというものではありません。

デザインの基本原則を抑え、情報整理における5W1Hを決める。Takramと考える「ノンデザイナーズデザイン」ラクスル社内勉強会レポート

こんにちは、「RAKSUL DESIGN MAGAZINE」です。デザイン・イノベーション・ファーム「Takram」と「RAKSUL」の2社で、定期的に開催している勉強会。今回は「ノンデザイナーズデザイン」をテーマに、ノンデザイナーの方に向けて情報をわかりやすく伝えるための、デザインにおける基本原則を学ぶ会が行われました。デザイナー職以外のビジネス職の方も、資料 / スライド作成などの作業は常日頃から行っています。しかし、作り方によっては意図していた内容が伝わらなかっ