タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
Googleでの「Design Docs」とは 2007年の Google Developer Day Tokyo での鵜飼氏のプレゼンによると「Google で必ず書くことになっているドキュメント」であり、「プロジェクト立ち上げ時の 1～2週間をかけて書く」ものです。 今回は Google のソフトウェアエンジニアである @cramforce 氏が自身のブログで「Googleでの Design Docs」について解説している記事を公開されていたため、氏の許可を得て翻訳しています。 原文： www.industrialempathy.com 関連書籍： Googleのソフトウェアエンジニアリング ―持続可能なプログラミングを支える技術、文化、プロセス オライリージャパンAmazon 読了目安：11分 (目次) デザインドキュメント の解剖学 文脈と範囲 目標と非目標 実際のデザイン システ
相手に誠実に、わかりやすい文章を書くための心がけをまとめました。 どういう思考プロセスからどんな表現が生まれるのか、参考として実例を紹介しています。実際に読み比べ、SmartHRの従業員として何かを伝えようとするときの、参考にしてください。 伝わる文章のガイドライン何を伝えるかによって、必要な情報の量や説明の粒度は異なります。 情報が不足していたり、逆に情報が多すぎたりすると、読者が意図を読み取れないことがあります。 読み手となる相手の状況（読む場面、事前知識など）を踏まえ、言葉にする内容や表現を厳選することが大切です。 目的に合わせて情報を取捨選択する読者の目線に立ち、コンテンツの目的に合わせて情報を取捨選択しましょう。 実例1：法律や業務に関わる記事目的業務に関係する「厚生年金保険」について正確に知りたいと思っている人に、わかりやすく内容を伝える。 Before日本の年金制度は、全国民
WebページのURLを入力するだけで、編集可能なFigmaデザインに変換できる無料プラグインを紹介します。 AppleなどのWebページを1クリックで変換するのはもちろん、日本語のWebページでも問題なく動作しました。Webデザインの勉強用に、既存サイトをリニュアールする用にも便利ですね。 html.to.design -Figma URLを入力するだけでFigmaに変換 html.to.designの利用方法 html.to.designの使い方 URLを入力するだけでFigmaに変換 html.to.designは、URLを入力するだけでFigmaに変換できる無料のプラグインです。さまざまなWebページを編集可能なFigmaデザインに変換します。 すべてをゼロから作成することなく、別のWebサイトを使用して独自のデザインのインスピレーションを得られます。 既存のWebサイトをリデザイン
グリズリーデザインでは本当の意味でお客様のお手伝いするために常日頃から沢山の情報に触れるようにしています。 その情報源の中の１つである本、そして特に僕たちの仕事を支えてくれている本2冊について書きたいと思います。 デザイナーだからデザインだけしておけばいいのではなく、ビジネスやマーケティング、ブランディングについて知っていないと本当の意味でお客様の力になることはできないのではないかと考えています。 こう考える理由としては、僕自身が前職でデザイナーではなくマーケティングを意識した商品開発のお仕事をさせていただいていたことにあると思います。 そもそもなぜ本から学ぶのかグリズリーデザインではネットの有象無象の記事や情報ではなく、本や実績を出されている方の講座やセミナーから学ぶことを大切にしています。 やはり人間、学ぶ時間は限られており、すべての情報にタッチすることはできません。 とはいえ、読んで
はじめに スタンフォード大学の John Ousterhout 教授が執筆された “A Philosophy of Software Design”(以下 APoSD と略す) という書籍をご存じでしょうか？ 書籍のタイトルを直訳すると、「ソフトウェア設計の哲学」となります。書籍の内容はまさに、ソフトウェア設計について扱っています。 本書籍をベースに、「A Philosophy of Software Design を30分でざっと理解する」というお題で社内ランチ勉強会が開催されました。本記事執筆者である岩瀬(@iwashi86)が発表者であり、勉強会資料は以下のとおりです。 スライド P.4 に記載したとおり、本書籍は John Ousterhout 教授の意見が強く反映されており、ソフトウェアエンジニアであれば、議論を呼ぶ箇所があります。実際、勉強会の実況Slackでは、「これはどうな
2023-11-21 技術的負債に向き合う Online Conference https://findy.connpass.com/event/297813/
UXや認知科学のブックリストはおかげさまでかなり読まれていますが、そういえば「UIデザイン」のリストは作ってなかったなと思い至って本を探し始めました。手元の本を並べてみると該当する本はあまり多くなくて、関連する周辺の分野のものにも対象を広げることにしました。UIデザインと周辺分野との境界はハッキリと分かれるわけではないので、自分が作った他のブックリストとの重複があります。また、分野の明確な線引きはしていませんのでご了承ください。 UI（ユーザー・インタフェース）が関わる分野はかなり広いのですが、このリストでは主に、比較的新しい（と言ってもiPhone発表から10年以上経ちますが）「スマートフォン・アプリのUIデザイン」を念頭において選んでいます。パソコンのソフトウェアや情報システム、ウェブ（情報設計やウェブ・ユーザビリティーを含む）のインタフェース・デザインについては、すでに世の中に知見や
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
あけましておめでとうございます、になるはずだったのですが、後から読んだ『Googleのソフトウェアエンジニアリング』の方を先に記事にしたので新年2本目の更新です。 ky-yk-d.hatenablog.com さて、本題。最近のお気に入りポッドキャストであるe34.fmで激賞されていた『A Philosophy of Software Design』を読みました。初版は2018年に出ていて、今回は2021年に出た第2版を読みました。 スパゲッティコードを想起させる装丁 A Philosophy of Software Design, 2nd Edition (English Edition) 作者:Ousterhout, John K. Amazon scrapbox.io どんな本？ 書籍のテーマはソフトウェアの複雑さです。複雑さとは、システムを理解したり変更したりするのを困難にさせるも
WebデベロッパーのVictor氏による下記のツイートから始まるスレッドが大変参考になる内容だと感じたので、ご本人に許諾を得て日本語で紹介させていただくことにしました。 I reviewed 100+ user interfaces this year. Avoid the most common 18 mistakes to make your UI/UX design better 👇 — Victor (@vponamariov) July 30, 2021 私は今年100以上のユーザーインターフェースをレビューしました。あなたのUI/UXデザインをより良くするための、下記に示す18個の良くある誤ちを回避しましょう。本記事で使用する画像はすべてVictor氏のツイートから拝借しています。なお翻訳には一部私の意訳が入っていることをご了承ください。 1. 薄いコントラストの文字適切では
みなさん、コードを書く前に設計書を書きますか？ 書くか書かないかは人それぞれだと思いますが、「設計」というプロセス自体は意識的であれ無意識的であれエンジニアであれば全員やっていることだと思います。 今回は設計プロセスの改善という文脈で私たちがDesign Docという仕組みを導入したことについて共有しようと思います。もし同じような状況を経験している人がいたら参考になれば幸いです。 導入の背景まずは導入するに至った状況からお話します。 私たちのサービスは、利用していただくユーザーの数が増加しています。それに伴って品質のハードルも上がってきました。サービスに障害が発生するとユーザーさんに大きな損害を出してしまうことになるからです。そこで今まで以上に安全にサービスを開発できる仕組みづくりが必要になりました。ですが、実現のためには大きく2つの課題がありました。 課題1. 開発スピードが徐々に鈍化し
PHP Conference Japan 2020 トーク前提の資料です。そのため、トークがないと理解が難しいかもしれません。 https://youtu.be/UTKJ-Lgn3aI?t=36 ※冒頭音声が小さいです。マイクを手に持ってから聞こえやすくなると思います。 資料中の ADOP …
こんにちは。デザインチームの八嶋です。2021年3月22日、SMBCのホームページが大幅にリニューアルされました。このホームページリニューアルは、約5年ぶりの大幅リニューアルでページ数は約1500ページにも及ぶ大プロジェクトでした。このプロジェクトはインハウスデザイナーによるホームページのデザインディレクションとデザインチームが作ったデザインシステムによる連携で作られています。ホームページの役割からUIの設計までコアとなる部分をインハウスデザイナーが設計し、多数のパートナー様にもご協力いただき完成させています。（特にトランスコスモス様、ありがとうございます。） 今回のnoteは、ホームページリニューアルチームの一員でもある八嶋が、デザイナーの大塚とプロジェクトマネージャーの髙橋、そして、デザインシステムを担当したデザイナーの金澤にインタビューをしました！ ホームページリニューアルを通して、
自分が良い Design Docs(Software Design Document)を書くために、読んだ/参考になったリソース集 一覧 Design Docs とは Design Docs at Google デザインドック(Design Doc)について デザインドックで学ぶデザインドック 残業も減らせる!? 上級エンジニアになるための Design Doc 超入門 「Design Doc」って何なのか？ What Is A Design Doc In Software Engineering? (full example) What is a Design Doc: Software Engineering Best Practice #1 https://github.com/kaiinui/note/blob/master/Design--Designdoc.md Googleの
全AWSエンジニアに捧ぐ、CloudWatch 設計・運用 虎の巻 / CloudWatch design and operation bible
数年前、私はこんな絵を書いて、アジャイル開発やリーン開発のついての様々なプレゼンで用いた。 そこから、この絵は急速に広まっていった！記事、プレゼン、さらには本（Jeff Pattonの”User Story Mapping”という素晴らしい読み物なのだが）にまで至る所で姿を見せた。多くの人がこの絵は反復型開発、リーンスタートアップ、MVP(minimum viable product)の本質をよく捉えていると伝えてくれた。しかし、元の文脈から切り離して物事を捉える際にはごく自然なことであるのだが、この絵を誤解している人がいる。簡素化しすぎだと非難する人もいる。（正しい指摘である） この絵はあくまで比喩である。実際の車の開発の話ではなく、車を比喩とした一般的なプロダクトの開発の話なのである。 とにかく、これらのバズからこの考えの背景を話す時だと判断したのだ。 １つ目の例：not like
こんにちは、鈴木です。 「テストが無い」状態を脱却しました。 「いつの時代かよ！」と突っ込まれるかもしれませんが、モノタロウは創業から 20 年ほど EC をやっています。昨日書いたコードも、15 年前に書いたコードも、元気にビジネスを支えています。 本記事ではモノタロウの EC を支える API の話をします。「テストが無い」状態がスタートラインでした。そこから、CI を導入して、ローカル開発環境の整備して、テストコードを書いて、リリースマネジメントを導入しました。 目新しいことは書きません。長寿の大規模システムであっても、愚直に数年取り組むことで、「前進できる！」「変えられる！」という実例を書きます。 ※本記事の初出は、 Software Design2021年9月号「Pythonモダン化計画（第2回）」になります。第1回の記事は「Software Design連載 2021年8月号
日本はユーザー組織よりもベンダーにIT人材が集中していることが、DXを阻害しているといわれる。すぐにオンプレのサーバーを売ろうとする、クラウドで頼むといってもIaaSで持ってくる、ちょっと目新しい技術を指定したら見積もりが跳ね上がる。そういったSIベンダーに対するフラストレーションが、ひょっとして内製に切り替えれば、もっと迅速かつ低コストに新技術を導入できるのではないか？という期待に繋がっているように見える。 もしも夢が叶うならば、決められた予算、決められた要員で、生産性が高い最新の技術を習得しながら、環境変化を受け入れつつ、予定通りプロジェクトを完遂できるに越したことはない。しかしながら世の中にはトレードオフがあって、決められた予算、決められた要員、決められた期日通りにプロジェクトを仕上げたいのであれば、実績あるチームが、枯れた技術を使って、余裕あるスケジュールで、要件を固める必要がある
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
どんなコース？Googleのエキスパートが授業をしてくれる、UXデザイナー養成オンラインコースです。UXデザイナーになるためのグーグル認定のトレーニングを受講でき、1日1時間ぐらい受講して、だいたい6ヶ月で満了できる。 トータルで以下の7コースを、半年かけて履修する。 1. UXデザインの基礎 2. UXデザインプロセスをはじめる 3. ワイヤーフレームと低精度プロトタイピング 4. UXリサーチと初期コンセプトのテスト 5. Figmaでの高精度のデザインとプロトタイピング 6. Adobe XDによるレスポンシブWEBデザイン 7. ソーシャルグッドのためのUXデザインと、就職の準備 とると何がおきるの？グーグル認定の証明書がもらえます。いろいろな会社を受けるときに、履歴書にかけるみたい。 印刷された履歴書、CV、またはその他の文書で、LinkedInプロフィールの修了証セクションにあ
保守しやすく変化に強いソフトウェアを支える柱 自動テストとテスト駆動開発、その全体像 ～Software Design 2022年3月号「そろそろはじめるテスト駆動開発」より 今回、Software Design 2022年3月号 第2特集「そろそろはじめるテスト駆動開発 JavaScriptでテストファーストに挑戦」の第1章「保守しやすく変化に強いソフトウェアを支える柱 自動テストとテスト駆動開発、その全体像」を本サイトに掲載します。第2章以降については、本誌『Software Design 2022年3月号』電子版（Gihyo Digital Publishing、Amazon Kindle）をご購読いただければ幸いです。 第1章では、混同されることの多い自動テスト関係の概念を、自動テスト、テストファースト、テスト駆動開発の3つの段階に分け、それぞれの効果や注意点を説明します。ソフ
WebページのURLを入力し、1クリックするだけで、そのページの編集可能なFigmaファイルに変換できる無料プラグインを紹介します。 去年紹介しましたが、先日ver.2にアップデートされました！ 一括インポート、マルチビューポート、マルチテーマ、テキストとカラーのスタイル生成ができるようになり、さらに便利になりました。 AppleなどのWebページを1クリックで変換するのはもちろん、日本語のWebページでも問題なく動作しました。Webデザインの勉強用に、既存サイトをリニュアールする用にも便利ですね。 html.to.design -Figma デスクトップとスマホも同時に！ 1クリックでWebページをFigmaに変換 html.to.designの利用方法 html.to.designの使い方 1クリックでWebページをFigmaに変換 html.to.designは、URLを入力して1ク
こんにちは。フロントエンドチームの金野と申します。 食べログでは現在、React+TypeScriptでフロントエンドのリプレースを進めています。 以前の記事で、食べログではAtomic Designをどのように取り入れているかの紹介をしました。 しかし、最近のリプレース作業では、Atomic Designとは異なるディレクトリ構造を採用しています。 今回の記事では、「なぜAtomic Designをやめたのか」という理由と、「どのようなディレクトリ構造にしたのか」を紹介します。 Atomic Designを導入したねらいと導入した結果 上記の記事で言及した通り、当初Atomic Designを導入したねらいは以下になります。 1. コンポーネントの責務がより明確になる 2. 見た目の粒度だけでなく、ロジックの責務も明確にできる 3. 「ドメインが入るか／入らないか」。「抽象的か／そうでな
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに エンジニアのみなさま、日々の学習本当にお疲れ様です！ また本記事まで足を運んでいただき本当に感謝です。 最後まで読んでもらえると幸いです。 システム設計はエンジニアにとって重要なスキルですが、いざ学習しようとすると幅広い知識と実践的なスキルが求められるため、独学ではハードルが高く感じられることも多いです。今回は、システム設計を学ぶためのオープンソースプロジェクト 「system-design-primer」 を紹介します。system-design-primerを活用することで、システム設計の基礎から応用まで体系的に学べるとの
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 Design Documentと聞くと何を想像しますか？ 一般的にDesign Documentが指すのは設計書であることが多いのではないでしょうか。 設計書、簡単に説明するのであればソフトウェアを「どうやって作るの？」を説明したドキュメントです。 Googleではソフトウェアエンジニアリング文化における重要な要素として、今回お話ししていくDesign Docsと呼ばれるものがあります。 Design Docsとは？ Design Docsとは、開発者がコーディングに着手する前にソフトウェアシステムまたはアプリケーションの開発する
2021年のミニマリズムを中心としたトレンドが注目されていましたが、2022年は鮮やかで、奇抜で、記憶に強く残るようなデザインを中心としたトレンドが注目されています。 今回は、2022年に流行するWebデザインの10個の最新トレンド予測をご紹介したいと思います。1つ1つのトレンドごとに実際のWebサイトの事例を掲載しているので、ぜひご自身で体験してみてください。 1. 3Dイラスト 3Dのイラストを使ったデザインは、2021年の大きなトレンドの1つとなりましたが、2022年はさらに注目すべきトレンドの1つとなるでしょう。特に2Dのフラットなイラストを3Dに変化させたような、2Dと3Dを組み合わせたスタイルは要チェックです。 リアルで魅力的な楽しいイラストに、柔らかなキャンディーカラーと組み合わせたようなスタイルは、特にアプリのデザインなどでトップトレンドになると考えています。 Dribbb
MdN Bau-ya “「わかりやすさ」をデザインする 情報アーキテクチャ（IA）必修入門” (2023/1/18開催) https://www.street-academy.com/myclass/149720 上記イベントで使用したスライドを公開用に編集したものです。 作者：森田 雄 / …
あなたがさっきまで読んでいた技術的に役立つ記事は、10年後も使えるでしょうか？ほとんどの場合でいいえ はじめに 短期的に効果的な手法や知識は、ソフトウェア開発の分野において、急速に価値を失う傾向があります。この現象は、私たちが何を重点的に学ぶべきかを示唆しています。最も重要なのは、第一に基本的な原理・原則、そして第二に方法論です。特定の状況にのみ適用可能な知識や即座に結果を出すテクニックは、長期的には有用性を失う可能性が高いです。これは、技術や手法が時間とともに進化し、変化していくためです。 learning.oreilly.com 「API Design Patterns」は、このような考え方を体現した書籍です。しかも480 ページもあります。本書は単なる手法の列挙ではなく、Web APIデザインの根幹をなす原則と哲学を探求しています。著者のJJ Geewax氏は、APIを「コンピュータ
Webサイト上の要素に背景を表示したい場合、シンプルに画像で表示する形が一般的ですが、CSSを使って背景パターンを表示するという方法もあります。 ドット柄やチェック模様、ストライプなど色々な種類の背景パターンをCSSだけで作ることができ、使い方を覚えておくとWebデザインに色々と活用することができます。 今回は、CSSだけで背景パターンや模様を表示するメリットや、様々なサンプルコードが掲載されているおすすめのサイトをご紹介したいと想います。 CSSで背景パターンを作るメリット Webページ上の要素に背景を適用する場合、一般的には画像ファイルを用意してbackground-imageプロパティに指定することが多いですが、CSSだけでも様々な背景パターンや模様を作ることができます。 画像ではなくCSSで背景パターンを作った場合のメリットとして、例えば次のようなものが挙げられます。 背景画像を書
Software Design連載開始 ※ (2021/09/02 08:55) 「Pythonを用いて開発を始めたのが2003年」を「Pythonを用いて開発を始めたのが2002年」に修正 こんにちは。金谷です。 このたび、モノタロウにおけるPython大規模開発に関する取り組みを、技術評論社様で発刊されている Software Design に連載させていただくことになりました。 モノタロウがPythonを用いて開発を始めたのが2002年。2021年の現在もPythonを用いた開発が続けられています。 事業の成長に伴い、関連するシステムやエンジニアの数も増え続けていくなかで、いかに安定的に価値を提供し続けられるのか。 モノタロウにおける取り組みを、開発や運用周りを通してご紹介していきます。 本記事の初出は、 Software Design2021年8月号「Pythonモダン化計画（第1
なぜかあまりネットに流れてない情報なんですけど。UXデザイン界隈では有名な「グーグルUXデザインプロフェッショナル認定証」って講座があるんですが、実はそのコース3でFigmaのEducation planの特典があります。 社会人… https://t.co/1pURyKMUCt
これはなに？昨年末にOpenAIがリリースしたチャット型AIの「ChatGPT」と一緒にデザインしていくプロセスで、実際にどんなことができるか？を実験してみたnoteです。 前提と注意点 🚨まずこのnoteの趣旨は「これらが実用的にデザイン制作に使える！」といったものではありません。 どちらかというと遊びに近く、実験的に行ったもので、結論から言うと現時点では実用的に使える要素はまだ少ないかなと思います。 また、前提として私はまだまだAIやChatGPTについて詳しいわけでは全くなく、これからちゃんと勉強してみようと思ってるぐらいのレベル、という前提で読んでいただけると幸いです。 （AIについて本を読んだり座学的な勉強から入るより「とにかく何かしら触ったりつくったりしてみる」方が楽しめると思い、せっかくなのでその実験の過程をまとめてみました。） 「こういうこともできるよ」「このやり方の方が
はじめに 本記事は前回の記事である「ソフトウェア設計についてtwada技術顧問と話してみた 〜 A Philosophy of Software Design をベースに 〜 - NTT Communications Engineers' Blog」の続編です。 前回の記事の内容がベースとなっていますので、「APoSD って何だっけ？」という場合はぜひ前回の記事をご覧になってから、以下にお進みください。 ということで、後編の対話パートにさっそく入っていきましょう！ Pull Complexity Downwards iwashi: APoSD では、複雑性を下に追いやる(Pull Complexity Downwards)という話が出てきます。何らかの処理が複雑になる場合、それを隠蔽してインターフェースを極力シンプルに保つ、というのがAPoSDの主張です。 こちらに関しても、社内勉強会中で
Python Design Patterns¶ Welcome! I’m Brandon Rhodes (website, Twitter) and this is my evolving guide to design patterns in the Python programming language. This site is letting me collect my ideas about Python and Design Patterns all in one place. My hope is that these pages make the patterns more discoverable — easier to find in web searches, and easier to read — than when they were scattered acr
WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットです。PNGやJPEGと比べてファイルサイズを抑えることができ、トラフィックの削減やページ表示速度の向上を実現することができます。 今回は、WebP（ウェッピー）の基本と、メリットやデメリット、変換方法、対応ブラウザなどをご紹介したいと思います。 WebP（ウェッピー）とは？ WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットで、拡張子は「.webp」です。 WebPは、JPEGやPNGと比べ、同程度の画質の画像をより小さなファイルサイズで保存することができます。Googleの発表では、PNGよりも26%、JPEGよりも25%〜34％程度ファイルサイズを抑えることができると言われています。 また、WebPは背景透過（アルファチャンネル）や、アニメーションにも対応しています。つまり、JPEGのよ
【更新】寄稿した記事が Web に公開されました 技術評論社様のご厚意により、 Software Design 2022年3月号に寄稿した「自動テストとテスト駆動開発、その全体像」が gihyo.jp にて公開されました。誠にありがとうございます！ gihyo.jp はじめに 2022年2月18日発売の Software Design 2022年3月号 にて、第2特集「そろそろはじめるテスト駆動開発」の第1章「自動テストとテスト駆動開発、その全体像」を執筆いたしました。第1章では、混同されることの多い自動テスト関係の概念を自動テスト、テストファースト、テスト駆動開発（TDD: Test-Driven Development）の3つの段階に分け、それぞれの効果や注意点を包括的に整理整頓しています。 ソフトウェアデザイン 2022年3月号 作者:大竹 章裕,瀬戸口 聡,庄司 勝哉,光成 滋生,
ssmjp ssmonline #38 "第四回はたのさん祭 オンライン"( https://ssmjp.connpass.com/event/307397/ )での発表資料です。 (運用設計ラボ合同会社 波田野裕一)
20世紀末に発表された評伝によって近代デザイン史、タイポグラフィ史における重要人物のひとり、エリック・ギルの「不都合な真実」が明らかになった。以来、ギルの業績やその書体の運用をめぐって、さまざまな議論が交わされている。作者とその制作物は切り離して考えられるのか、否か。国際的に活躍する書体デザイナーが考える。 バナー画像：エリック・ギル、1908-9年頃（出典：Fiona MacCarthy, Eric Gill: Lover’s Quest for Art and God, 1989） 日本およびタイポグラフィの世界でエリック・ギル（図1）といえばエドワード・ジョンストンの弟子、そしてGill SansやJoanna、Perpetuaなど名作とされる書体の作者として有名だ。特に人気のGill Sans（図2）は、ジャンルとしてはヒューマニストサンセリフまたはジオメトリック（幾何学的）サンセ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
