Atomic Designをやめてディレクトリ構造を見直した話｜食べログ フロントエンドエンジニアブログ
こんにちは。フロントエンドチームの金野と申します。 食べログでは現在、React+TypeScriptでフロントエンドのリプレースを進めています。 以前の記事で、食べログではAtomic Designをどのように取り入れているかの紹介をしました。 しかし、最近のリプレース作業では、Atomic Designとは異なるディレクトリ構造を採用しています。 今回の記事では、「なぜAtomic Designをやめたのか」という理由と、「どのようなディレクトリ構造にしたのか」を紹介します。 Atomic Designを導入したねらいと導入した結果 上記の記事で言及した通り、当初Atomic Designを導入したねらいは以下になります。 1. コンポーネントの責務がより明確になる 2. 見た目の粒度だけでなく、ロジックの責務も明確にできる 3. 「ドメインが入るか／入らないか」。「抽象的か／そうでな
【2023】おしゃれな配色パターンが見つかる！カラーパレット人気ツール28個まとめ | Web Design Trends
配色はデザインにおいて重要な要素の1つですが、慣れている人でないとバランスの取れた配色を決めていくのは簡単ではありません。 そこで、今回は初心者の方でもおしゃれな配色ができるカラーパレットツール・配色パターン見本サービスをまとめました。下記のように、おすすめのツールや使用する色数ごとに分類しています。 おすすめカラーパレットツール・サービス AIを使ったカラーパレットツール 2色の配色パターン見本 3色の配色パターン見本 4色の配色パターン見本 5色の配色パターン見本 その他のカラーパレットツール・サービス グラデーションの配色パターン見本 2022年に流行するWebデザインの最新トレンド10個まとめ 2021年のミニマリズムを中心としたトレンドが注目されていましたが、2022年は鮮やかで、奇抜で、記憶に強く残るようなデザインを中心としたトレンドが注目されています。 今回は、2022年に流
Design Docs at Google
One of the key elements of Google's software engineering culture is the use of design docs for defining software designs. These are relatively informal documents that the primary author or authors of a software system or application create before they embark on the coding project. The design doc documents the high level implementation strategy and key design decisions with emphasis on the trade-of
エンジニアが無料で使える画像編集ツールとしてのAdobe XD入門 - Qiita
はじめに グロービスではプロトタイピングツールとして主にFigmaを使用しています。 Sketch はもういらない？ デザインツール Figma の紹介 Figmaはコラボレーションツールとして非常に優れており、デザイナーと開発者間の擦り合わせにも便利です。 しかし、開発時に必要なのはプロトタイピングツールだけではありません。 実装時の共有に画面キャプチャにちょっとした注釈をつけてSlack投稿したり、Githubに投稿するエビデンス画像を管理するのに便利な画像編集ソフトが欲しいこともあります。 Adobe XDは本来プロトタイピングツールですが、ちょっとした画像を作成したい時に便利な、ノンデザイナーにもオススメのツールです！ 注意事項 本記事はデザイナー向けの記事ではありません。エンジニアとして私が開発時に便利だと思った機能と、Adobe XDを使うメリットを紹介します。 プロトタイプツ
脱Adobe/Adobe 代替のためのソフト＋α (2017/2/06更新)
脱Adobeのためのソフトと関連しそうなソフトまとめです。 たぶん国内のまとめでは一番多く(また多機能)のソフトを紹介してるのでは？ Adobeの代替を探してる方や学生さんに参考にしていただければ幸いです。(あくまでも、趣味の範囲やお金のない学生向けです。可能ならAdobeでまとめたほうが情報も多いし、ソフト間の連携もシームレスになるのは言うまでもなく。) 基本無料か(性能・機能のわりに)安価なものです。 有名だけどあまり優秀でないと思ったものは記載してないものがあります。(ex, Pixa、Sai、Paint.net、MMD等) 各カテゴリのとなりの()はAdobeではどのソフトかを表します。 対応OSはWindowsかLinuxのみです。 Macを私は持ってますがあまり好きでないのと、ほかの方にあまりお勧めできない(主にスペック面で)ため載せてません。 今回はCADについてはまとめませ
Experience Design Out of Screen：これからのエクスペリエンスデザイナーの生きる道＠UX TOKYO Jam
Experience Design Out of Screen：これからのエクスペリエンスデザイナーの生きる道＠UX TOKYO Jam 7月26日にUX TOKYOが主催するUXについての一大イベントUX TOKYO Jam 2014で、「Experience Design Out of Screen:これからのエクスペリンスデザイナーの生きる道」と題したセッションを行います。本エントリーは、このイベントに参加予定の方に向けた内容です。 このセッションで私はあるシンプルな問いをみなさんに投げかけたいと思います。 UX / UIデザイナーは、3年後も「画面のデザイン」を主な仕事としているでしょうか。 私の答えは、明確にノーです。 スマートフォンの普及によって、私たちの仕事はすでにジェスチャーやセンサーや音声対話などを組み合わせ、現実の世界およびその中の人間の身体とより自然な方法でインタラク
プログラマーがイラレで絵を描けるようになると、こうなる - ppworks.jp
プログラマー、絵が描けないじゃないですか（偏見） こんなじゃないですか。 なので描けるようになりたいなとずっと思っていて、ベジェ曲線って滑らかでナンカヨサソウ、とチャレンジしました。 「ベジェ曲線」習熟ドリル 7,8年前に買ったのがこれ。そう、チャレンジは2回目なのです。前回は3ページぐらいで挫折してました。んで、最近急に暇になったのをキッカケに「よしやろう」という気になり始めたのです。 改訂二版〈Illustratorで学ぶ〉「ベジェ曲線」習熟ドリル 作者: 中村高之出版社/メーカー: ラピュータ発売日: 2005/04メディア: 単行本購入: 2人 クリック: 8回この商品を含むブログ (4件) を見る (2014.1.10追記) なんと、長らく手に入りにくかったこちらの書籍が新装改訂版で再登場とのこと。 表紙が若干、損していた分、今回はスタイリッシュで内容と合っていてヨサソウです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Pairsのデザインシステムを運用してみて。デザイナー視点のツール編🛠 - eureka design