エンジニアとデザイナーの共業≒協業を目指すための、Atomic Designの使い方 Part2
2018年10月18日、Roppongi Designersが主催するイベント「Designer X Engineer Development #01」が開催されました。デザイナーとエンジニアでどのように開発を進めていくか。デザインをプロダクトに落とし込むプロセスについて、どのような設計方法・ツール・コミュニケーションを行なっているかを共有する勉強会。今回は、5社のエンジニア・デザイナーが集い、自社における協同の現状を紹介します。プレゼンテーション「共業≒協業を目指すためのAtomic Designの使い方 」に登場したのは、DMM.comの河西紀明氏。 DMMの動画サービスに見る具体例 河西紀明氏：今回はせっかくなので、弊社のデジタルコマース事業のサービス開発環境をカイゼンするためにおこなった、アトミックデザインの概念を活用したUIインベントリの実施についてご紹介いたします。 デジタルコ
Yahoo! JAPAN トップページを Atomic Design と React・Redux・TypeScript で作り変えたお話
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちはお久しぶりです。岡部和昌（@kzms2）と申します。 今回お話しする内容はタイトルでほぼ全部述べているのですが、PC 版 Yahoo! JAPAN のトップページを 2019 年 10 月 1 日に刷新、主に開発環境をアップデートした経緯と採用した技術に関してのお話です。 見た目に関しては特に大きな変化はなかったので、気が付かなかった方も多いのではないでしょうか？ なぜ刷新したか Yahoo! JAPAN トップページは 2008 年 1 月 1 日に大規模なリニューアルを行いました。その頃からある程度の改修はあったものの、基本的にはコードの継ぎ足しで修正を加えている状態でした。 （参照；Yahoo! JAPAN トップ
デザイナーとエンジニアで考えるReactコンポーネント設計 - KitchHike Tech Blog
コンポーネント設計がReact Nativeの開発速度に直結する CTOの Shoken です。キッチハイクでは1年半前に0ベースからReact Nativeでアプリ開発を始めました。React Nativeアプリを長期的に開発・メンテナンスする際に重要になるのがコンポーネント設計です。1年半の開発を通して、デザイナーとエンジニアがコンポーネント設計での共通認識を持っていることが、機能追加・修正などの開発速度に直結するという学びを得ました。この記事では、キッチハイクアプリのコンポーネント設計の考え方を紹介します。 コンポーネント設計がReact Nativeの開発速度に直結する Atomic Designという共通言語 コンポーネントを構成する4つの要素 "デザインとしての構造性" と "コードとしての再利用性" ButtonはAtomなのかMoleculeなのか問題 Atomic Des
Atomic Designを分かったつもりになる
「Atomic Design」（アトミック・デザイン）という言葉がしばしば聞かれるようになってきました。実際にちょっとしたトライアルをしつつ、Atomic Design について考えてみました。
珍しいワークフロー：Atomic Designの原則とSketchでデザインからプログラミングまで | POSTD
概要： Sketchを使ったAtomic Designの方法がプロダクトデザインの未来形です。 初めに この記事は、上のビデオの素晴らしい人物、Brad Frostの開発したシステムについて書いています。Atomic Designは今のレスポンシブなデジタルの世界に対応するために開発されたものです。 ここ何年も、私たちのデザインを少しでも理解してもらえるよう、スタイルガイド、基本的ガイドラインやムードボードなどのツールを作成してきました。同じように、開発者もBootstrapやFoundation、Bourbonなどのツールでプログラミング作業を楽にしようとしてきました。互いに妥協点を見いだし協力することで互いの作業を楽にできます。Atomic Designはまさにそれを実現しようとしています。 Atomic designはあるインスタンスやページをデザインすることではありません。大局的に
Vue CLI 3 x Atomic Design × Storybookを使ったコンポーネント開発を試す【環境構築編】 - えんぴつぶろぐ
はじめに 先日「Atomic Design ~堅牢で使いやすいUIを効率良く設計する」を読みました。 Atomic Design ~堅牢で使いやすいUIを効率良く設計する 作者: 五藤佑典出版社/メーカー: 技術評論社発売日: 2018/04/25メディア: 単行本（ソフトカバー）この商品を含むブログ (1件) を見る こちらの本では、Atomic Designの考え方だけでなく、ReactやStorybookを使った具体的な実装方法まで詳しく解説されています。 早速試してみたい！と思い、せっかくなのでVue.jsで試してみました。 まずは環境構築から始めます。 本当はComponent作成時のTipsについてをメインに書きたかったのですが、思ってたより長くなってしまったので分割して更新していきまます…。 はじめに Atomic Designとは Vue CLI 3とは Storybook
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
