#デザインシステム記事まとめ

203

本

デザインシステム関係の記事まとめ / #DesignSystems #デザインシステム / 運営メンバーも募集中。/

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

#スタイルガイド

デザインシステムを導入する為にやって良かったこと５選

こんにちは。クラウドワークスでデザイナーをしているYUCCAです。今回「デザインシステムを導入する為にやって良かった事５選」のお話をしたいと思いますが、デザインシステムと一言で言ってもいろんな側面を持ち抽象度が高いので、前提としてこの記事でのデザインシステムのスコープや私たちのデザインシステム「norman」について軽く紹介させてください。クラウドワークスのデザイン基盤チームでは、スケーラビリティを持ちながらUIデザインの品質を高められようにする為の一貫した仕組み（デ

📘️ Book Club:デザインシステム導入が失敗に終わる理由とそれを機能させる方法

デザインシステムに興味がある方は、おそらく多くのサクセスストーリーに精通しているかと思います。デザインシステムを使うことで不整合と冗長性を排除でき、ユーザビリティ・テストや、ワークショップなどといったもっと重要なアクテビティに時間を使うことができます。これは大きな付加価値だと思われます。しかし、デザインシステムの導入が失敗に終わることもしばしあります。デザインシステムはさまざまな分野の人々がチームとして協力する必要があり、成功するデザインシステムを作成することはとても困難

CI&UIリニューアルしながらデザインシステムを作った話

「コデアル」という求人サービスのデザインシステムを作ってみました。CIリニューアルに伴う全スタイル＆コンポーネントの刷新、エンジニア＆デザイナー間の協業、そして約3ヶ月運用してみた感想をつづってみます。実際に使っているドキュメント、Sketchファイルはこちら↓ ・Codeal Design Guideline ・Codeal UI Kit.sketch ・Sketch Tips for Codeal Design Guideline Codeal Design Gu

次世代Webカンファレンス2019 デザインシステムに関する議論の備忘録

このマガジンで全文公開を進めている書籍「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」ですが、監訳者の佐藤伸哉さん、レビュワーの長谷川恭久さんが登壇されたイベント「次世代Webカンファレンス2019」が1/13に開催されました。個人的な備忘録として、セッションの動画、ツイートなどをまとめておきますので、書籍を併せて目を通していただけると有意義かもしれません。書籍は事業会社視点で書かれていたので、「“誰か”ががんばって作ってしま

4章認知パターン内容紹介（1）

今日から新しい章、4章「認知パターン」を見ていきましょう。認知パターンとはアイコン、色、タイポグラフィなど、特定の種類の外観にしたり、感情とプロダクトの結びつきを強めたりするのに使われるパターンです。全6回の予定です。このマガジンは、2018年12月21日に全国書店、25日にAamazonで発売された「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集した私が、個人アカウントでこの本を紹介するものです。 ※こちらはコリスさんに

年末年始に届いた、📕の読後の感想など

このマガジンで全文公開を進めている書籍「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」ですが、12/25のネット発売を経て年末には書籍全体でベスト50に入るなど快調な滑り出しを見せました。皆さま、本当にありがとうございます。年末年始の「課題図書」としてお読みいただいた方も多く、いくつか読後の評価をいただいています。全文公開の再開に先立ち、年頭のノートとしていくつか紹介させてください。 − − − − − こちらは、電子版で原著

3章機能パターン内容紹介（4）

3章「機能パターン」は、このノートが最後です。機能パターンを定義する際に有用なテクニックについて見てきました。最後に、似ているパターンを強弱や度合いといったスケール上で比較し、定義したパターンを検証するための仮説としてコンテンツを扱う方法について解説します。このマガジンは、12月21日に全国書店、25日にAamazonで発売された「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個人アカウントでこの本を紹介するも

3章機能パターン内容紹介（3）

機能パターンを定義する際に有用なテクニックについて続けましょう。パターンマップやインターフェースインベントリーで機能パターンを定義したら、次にパターンを行為でとらえて構造を描き、パターンの機能を明らかにします。このマガジンは、12月21日に全国書店、25日にAamazonで発売された「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個人アカウントでこの本を紹介するものです。全貌をいち早くお読みになられたい方は、ぜ

3章機能パターン内容紹介（2）

3章「機能パターン」とは、ボタン、ヘッダー、フォーム要素、メニューなどインタフェースの具体的な構成要素であることを紹介しました。では、機能パターンを定義する際に有用なテクニックとは何か、いくつかのポイントを紹介していきましょう。最初は、パターンマップやインターフェースインベントリーの作成についてです。このマガジンは、12月21日に全国書店、25日にAamazonで発売された「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集して

本日発売、Amazonでベストセラー1位！

このマガジンで全文公開を進めている書籍「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」が、12月21日に書店、25日にAmazonをはじめとするネットで発売されました。 Amazonのランキングで。。。・「Web構築・管理」の書籍部門で1位・その上位カテゴリ「Web開発」の書籍部門で1位・さらに上位カテゴリ「コンピュータ・IT」の書籍部門で4位・さらにさらに上位カテゴリ「本」で42位をいただきました！（12/28更新）

3章機能パターン内容紹介（1）

今日から新しい章、3章「機能パターン」を見ていきましょう。2章でデザインシステムを検討する上での最上流とも言える「デザイン原則」について紹介しましたが、いよいよデザインパターンについて具体的に解説します。3章は、インタフェースの具体的な構成要素である「機能パターン」です。全4回の予定です。このマガジンは、12月21日に全国書店、25日にAamazonで発売された「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個

章末インタビューをPDFで全文公開！

このノートでは、「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」の各章末にバラバラに収録されているインタビューを再編集し、PDFでお届けします。このマガジンは、12月21日に全国書店、25日ごろにAamazonで発売になる「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個人アカウントでこの本の作りかけの断片を紹介するものです。予約ヨロシクでございます。インタビューに

2章デザイン原則内容紹介（5）

2章「デザイン原則」は、このノートが最後です。第3章と第4章ではデザインパターンの詳細を見ていくわけですが、章の最後にデザイン原則やブランド価値といったコンセプトを、どのようにデザインパターンとして具体化するのかについてみていきましょう。このマガジンは、12月21日に全国書店、25日ごろにAamazonで発売になる「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個人アカウントでこの本の断片を紹介するものです。予

2章デザイン原則内容紹介（4）

2章「デザイン原則」の一部紹介、残すところ2回となりました。今回は、いよいよデザイン原則の定義を進める際の考え方について見ていきましょう。このマガジンは、12月21日に全国書店、25日ごろにAamazonで発売になる「Design Systems − デジタルプロダクトのためのデザインシステム実践ガイド」を編集している私が、個人アカウントでこの本の断片を紹介するものです。予約ヨロシクでございます。 2章「デザイン原則」きちんと機能するシステムは、必ず明確な原則にもとづ

#デザインシステム 記事まとめ

フォローしませんか？

#スタイルガイド

デザインシステムを導入する為にやって良かったこと５選

📘️ Book Club:デザインシステム導入が失敗に終わる理由とそれを機能させる方法

CI&UIリニューアルしながらデザインシステムを作った話

次世代Webカンファレンス2019 デザインシステムに関する議論の備忘録

4章 認知パターン 内容紹介（1）

年末年始に届いた、📕の読後の感想など

3章 機能パターン 内容紹介（4）

3章 機能パターン 内容紹介（3）

3章 機能パターン 内容紹介（2）