[B! design] ohbaryeのブックマーク

状態設計から「なんとなく」を無くそう

ウォンテッドリー株式会社の社内イベント "Tech Lunch" で話した発表です。プログラムには大小さまざまな粒度の﹁状態﹂が存在します。状態の設計を工夫することで、コーナーケースの発生を抑止し、ユーザー体験を最適化することができます。本発表では、私が普段どのように﹁状態﹂について考えているか、言語や環境を問わずできるだけ普遍的に使える形での言語化を試みます。本発表を通じて、﹁状態﹂をなんとなくではなく合理的に設計するためのヒントを提供します。 GoogleスライドのURL: https://docs.google.com/presentation/d/1PNzz69UV05HlKPuWGlooemnPslLbLKsyLwl3R4U_XqE/edit

ohbarye 2023/12/17

リンク

A student asked how I keep us innovative. I don't. | nicole@web

Last week, I did a Q&A session for a friend's security class. One of the students asked a question that I loved. They asked something like, "As a principal engineer, how do you make sure your company stays at the forefront of innovation?" There are two reasons I love this question. The first is that it's a good and natural one, which I had early on too. The second is that it's unintentionally lead

ohbarye 2023/11/04

"As a principal engineer, I view it as my role to keep us off the bleeding edge as much as possible. That way, when we really do need to innovate, we have the capacity to do so. And when we don't need to, we can go really freaking fast."

リンク

サブスクリプション機能制御の設計における勘所 - inSmartBank

こんにちは、スマートバンクでアプリエンジニアをしているロクネムです。弊社では B/43という家計簿プリカアプリを提供しており、つい先日サブスクリプションサービス﹁B/43プラス﹂をリリースしました。このようなサブスクリプションを提供するサービスにおいては、そのサブスクリプションを利用しているユーザーのみが特定の “機能” を使用できるように “制御” する必要があるかと思います。このサブスクリプションの機能制御を実装するにあたって、﹁サブスクリプションが有効ではない場合は機能を制限する﹂という設計では実は不十分で、その他にもさまざまな要件を考慮した上でより柔軟な設計を行う必要があります。本記事では、このようなサブスクリプション機能制御の設計における勘所について、B/43プラスを例にご紹介します。 ※ 本記事は B/43 Tech Talk 〜 Fintech×サブスクリプショ

ohbarye 2023/08/04

リンク

DB外の副作用をトランザクションから分離しよう / Isolate out-of-DB side effects from transactions

gotanda.rb#52@オンライン "DB外の副作用をトランザクションから分離しよう"

ohbarye 2023/04/21

当たり前だけどあまり語られてないことについて。結論、RailsならIsolatorとAfterCommitEverywhereおすすめ。内部実装も読みやすいしRailsのinstrumentationやcallbackをうまく使っていて面白い

リンク

改めて整理するアプリケーション設計の基本

●発表のアーカイブ動画はこちら：https://youtu.be/4rgGkoyUaZw ●発表の中で紹介しているUdemy講座：https://www.nextskill.co.jp/courses === プログラミングの基礎を学び、アプリケーション開発に実践的に関わり始めると、「MVC」「サービスクラス」「ドメインモデル」「クリーンアーキテクチャ」といった、よく分からない単語に遭遇します。これはいわゆる「アプリケーションアーキテクチャ」という分野の話で、アプリケーション開発に関わり始めると、誰もが突き当たる壁の一つです。今回はアプリケーションアーキテクチャを学ぶ最初の一歩として、「MVC」や「3 層アーキテクチャ」などの、基本的な用語の意味や関係性を整理します。発表者が過去に書いた以下の記事を中心に、+α の内容を加えた発表になります。・「ビジネスロジック」とは何か、どう実装

ohbarye 2022/12/22

リンク

7つの入金外部サービスと連携して分かった実践的な”状態管理”設計パターン3選 | Kaigi on Rails 2022 - inSmartBank

こんにちは、株式会社スマートバンクでサーバーサイドエンジニアをしている mitani です。この記事は2022/10/21~22に開催されたKaigi on Railsでお話した内容を記事にしたものです。当日の発表はYouTubeからご覧いただくことができますが、まだご覧になっていない方で動画よりも文字で見たいという方向けに、特にお伝えしたかったポイントに絞りながらご紹介したいと思います。 www.youtube.com 外部サービスと状態管理サービスを作る際、状態管理は至るところで実装する必要のある機能です。例えばログイン状態、会員の登録状態等のどのようなサービスでも共通的に実装するものから、商品の購入状態、決裁フローの現在状態などサービスによって異なるものまで様々な状態管理があります。状態管理の設計方法はその機能の要件によって大きく変わってくるものではありますが、正確に状態を記録し

ohbarye 2022/11/07

リンク

7つの入金外部サービスと連携して分かった実践的な”状態管理”設計パターン3選

2022/10/21 Kaigi on Rails https://kaigionrails.org/2022/talks/shohei1913/

ohbarye 2022/10/21

リンク

Anatomy of Dynamic color | DroidKaigi 2022 - inSmartBank

こんにちは、株式会社スマートバンクでアプリエンジニアをしているロクネムです。みなさんはDynamic colorという機能をご存知でしょうか？ Dynamic colorとは、ユーザーの設定した壁紙における優位な色を元にパーソナライズされた配色を生成してアプリへ適用することができる、Android12から提供を開始した機能です。色という非常に主観的な要素をカスタマイズ可能にすることによって、ユーザーの嗜好をより尊重するデザインの提供を実現しています。 https://material.io/blog/start-building-with-material-you 本記事では、このDynamic colorという機能について、どのようなアルゴリズムをもとに優位な色を抽出し、そこからいかにして調和の取れたカラースキームを生成するのか、内部の仕組みを徹底解剖しながら説明していきます。そ

ohbarye 2022/10/06

色のプロだ...

リンク

状態、結合、複雑性、コード量の順に最適化する - valid,invalid

There’s No Such Thing as Clean CodeのHacker Newsコメント経由でコードやシステム設計・最適化についての良いコメントを見つけた。どうやらHacker Newsで何度も引用されているらしいが日本語で言及された記事が見つからなかったので取り上げてみる。コメントは2016年のSandi MetzのThe Wrong Abstractionに関するもので、発言者のcurun1rいわく「私は設計の優先順位をこの順序で学習することで、優れた開発者になれた」。*1 4つの基準と優先順位のガイドライン状態 > 結合 > 複雑性 > コード量私は状態 (state)、結合 (coupling)、複雑性 (complexity)、コード量 (code) の順に削減することでコードを最適化する。コードがよりステートレスになるなら、結合を増やすこともいとわない結

ohbarye 2022/01/31

blogged.

リンク

iOS とAndroid の違いクロスプラットフォームのアプリデザインで特に気をつけるべき点｜marin

私が一番最初にAndroid アプリをデザインしたのが2016年の初夏頃で、その頃はまだiOS・Android とデザインが違うのが主流でしたが、2021年現在のアプリはiOS もAndroid もプラットフォームごとの細かな違いはあれどほぼ同じデザインが主流となっています。これは2016年の10月にAndroid APIがBottomNavigationView に対応してからじわじわ浸透していった変化だと考えているのですが、その辺の歴史の話は省略します。プラットフォームは違えどスマートフォンアプリである以上デザインは同じ方が楽なので、共通化されていったのは自然な流れだと思います。実際両者が全然違うUI・デザインだと大変ですしね……。とはいえ、プラットフォームが違うので全て同じというわけにもいきません。iOS にはHuman Interface Guidelines、Android

ohbarye 2021/08/05

リンク

スケールする要求を支える仕様の「意図」と「直交性」 - Qiita

はじめにどんなソフトウェアエンジニアも拡張しやすくメンテナンスしやすいソフトウェアを作りたいと思っているはずです。また、どんなプロダクトマネージャも同様に拡張しやすいシンプルな要求を作りたいと考えているはずです。しかし、将来の不確実性や発展性に対して見通しを立てるのは難しいものです。そのため、開発チームの思いとは裏腹にソフトウェアの複雑性はどんどんと増大していきます。気がついたら技術的負債と呼ばれるような手もつけられない泥団子になってしまうということもしばしばです。誰もが生産性を下げるために機能を追加したいわけではなく、ビジネス価値を提供するために機能を追加したいだけなのにです。このような状況を避けるためにはどうしたらよいのでしょうか。今回はその一つの手段として、要求には隠れた「意図」があり、それを発見していくことの重要性についてまずはお話しします。さらにわかりやすい要求が持つ仕様の

ohbarye 2021/07/08

リンク

ソフトウェア設計原則は変更容易性に通ず - Shin x Blog

色々な原則や方法論はあれど、つまるところいかに変更容易性を確保するかと言う話に帰結するのでは。極論すれは、正しく動いていて変更する必要が無ければどのような作りになっていても構わない。一方、Web アプリケーションを稼働し続ける上で全く変更しなくて良いということもない。— Masashi Shinbara (@shin1x1) 2021年5月30日ソフトウェア設計、開発には多くの原則や方法論がある。例えば、DRY 原則や SOLID 原則、デザインパターンにレイヤードアーキテクチャ、クリーンアーキテクチャなどある。さらに DDD にも多くの原則や方法論が含まれている。これらを変更容易性を高めるための手段として原則や方法論を捉えるというのが本エントリの論旨である。原則や方法論の捉え方変更容易性本質的な変更と副次的な変更外部変更容易性と内部変更容易性原則を適用する指針さいごに原則

ohbarye 2021/06/06

リンク

SMBCホームページ、デザインリニューアルの裏側。｜SMBC DESIGN

こんにちは。デザインチームの八嶋です。2021年3月22日、SMBCのホームページが大幅にリニューアルされました。このホームページリニューアルは、約5年ぶりの大幅リニューアルでページ数は約1500ページにも及ぶ大プロジェクトでした。このプロジェクトはインハウスデザイナーによるホームページのデザインディレクションとデザインチームが作ったデザインシステムによる連携で作られています。ホームページの役割からUIの設計までコアとなる部分をインハウスデザイナーが設計し、多数のパートナー様にもご協力いただき完成させています。︵特にトランスコスモス様、ありがとうございます。︶今回のnoteは、ホームページリニューアルチームの一員でもある八嶋が、デザイナーの大塚とプロジェクトマネージャーの髙橋、そして、デザインシステムを担当したデザイナーの金澤にインタビューをしました！ホームページリニューアルを通して、

ohbarye 2021/04/29

リンク

〜その意思決定を刻め〜「アーキテクチャ・デシジョン・レコード(ADR)」を利用した設計の記録 - スタディサプリ Product Team Blog

こんにちは。スタディサプリのWeb開発をやっている@highwideです。今日は、自分の所属する"コーチングチーム"(個別指導コースや合格特訓コースの機能開発を行っています)が、最近のプロジェクトで利用した﹁アーキテクチャ・デシジョン・レコード﹂、通称﹁ADR﹂について紹介したいと思います。アーキテクチャ・デシジョン・レコード(ADR)とは﹁ADR﹂﹁アーキテクチャ・デシジョン・レコード﹂という概念を知ったのは、社内で行っていた﹁Design It!プログラマーのためのアーキテクティング入門﹂(以後﹁Design It!﹂)の読書会でのことでした。 www.oreilly.co.jp 最初にそのキーワードが登場する﹁11.2.3 必要なときだけ形式的な記述に投資する﹂では、﹁"膨大な量のドキュメントになる傾向"がある形式的なドキュメンテーション﹂に対比して、以下のように紹介されます

ohbarye 2021/04/05

“プロジェクトが終わるまで、1つのissueのコメントに設計判断を書き連ねていく” "フレームワークを内面化できたことで文化形成に繋がった"

リンク

プロダクトマネジメントと事業開発に関する私的な振り返り - 下町柚子黄昏記 by @yuzutas0

TL;DR 企画力が…欲しい… pic.twitter.com/hJfr0qNv7T— ゆずたそ (@yuzutas0) 2020年11月19日試行錯誤の瓦礫の記録です。はじめにもくじ TL;DR はじめにもくじ以前書いた記事前提・免責アイデア 1日1案（やってよかったこと） 1stスクリーニング（やってよかったこと）コミュニケーションチームへのリスペクト（やってよかったこと）話す <<< 聞く（改善余地あり）即決する（やってよかったこと）自分で各論まで見る（やってよかったこと）発散→収束でディスカッション（改善余地あり）イラストで話す（改善余地あり）日次ミーティング（やってよかったこと）議事録を書く（改善余地あり）得た情報を共有する（改善余地あり）想定納期を示す（改善余地あり）カレンダー招待＆日程確約コメントを転記（改善余地あり）プロセス管理仮説

ohbarye 2021/03/28

リンク

消費者操る「ダークパターン」　国内サイト6割該当　【イブニングスクープ】データの世紀 - 日本経済新聞

ネット通販などのサイトで、消費者のスキを突いて余分な注文などを促す仕掛けが横行している。﹁ダークパターン﹂と呼ばれ欧米で規制が進むが、日本では大半が合法とされ対応が遅れている。日本経済新聞の調査で国内主要サイトの6割でダークパターンが確認された。デジタル技術の進化に、消費者保護ルールが追いついていない。﹁違法なダークパターンの疑いがある﹂。政府系のノルウェー消費者評議会は1月、米アマゾン・ドッ

ohbarye 2021/03/27

ux
design

リンク

Webのダークモードを実現するには - freee Developers Hub

こんにちは、freeeのUXチームでデザインシステム “Vibes” を作っている id:ymrl です。ダークモード流行ってますよね。私は最初はしっくりこないなと思っていたんですが、食わず嫌いは良くないと思って試しているうちに、いつの間にかダークモードのほうが落ち着くようになってしまいました。そしてそうなってくると、だんだん﹁自分たちの作っているWebサービスもダークモードに対応するべきなのか？﹂という気持ちになってきてしまい、最近はずっとダークモードのことを考えています。ということで今回はダークモードをやるべきなのか、実現する方法はどうなっているのか、UIデザインで気をつけるべき点何かというのを考える記事を書いてみます。 ※﹁ダークモード﹂はApple製品で使われている呼び方で、Androidでは﹁ダークテーマ﹂と呼ばれていて、Windowsでは﹁ダーク○○﹂のような呼び方をしてい

ohbarye 2021/03/20

リンク

ジャンプの漫画学校講義録⑥　作家編　松井優征先生「防御力をつければ勝率も上がる」 - ジャンプの漫画学校

週刊少年ジャンプ・ジャンプSQ.・少年ジャンプ＋編集部は、2020年度より、漫画家を対象とした創作講座﹁ジャンプの漫画学校﹂を開講しています。第1期の全10回の講義より、一部を抜粋し、本ブログで順に公開していきます。今回は﹁作家編①﹂から松井優征先生の講義の一部を紹介いたします。松井先生が語って下さったノウハウや考え方が、クリエイターの皆様の漫画制作の一助になれば幸いです。︻講師︼必ず身に着くテクニック﹁防御力﹂！松井　漫画では﹁面白さとは何だろう？﹂といった問題が常に付きまといます。一昔前の編集さんは﹁面白ければ何でもいい﹂と言い、では面白いとは何かと聞くと﹁人それぞれだよ﹂という人が多かったです。皆さんはそういう人の言うことを聞いてはいけません。﹁面白い﹂とは何なのか、それは作家も編集も本人なりに言語化できないといけません。そこでまず説明したいのが﹁防御力﹂です。松井　

ohbarye 2021/03/12

リンク

メルカリが検索に「売り切れ品」を置く理由、初期のLINEが友だち追加を「電話番号マッチング」に絞った理由など、アプリのマーケティング施策まとめ30｜アプリマーケティング研究所

2017年〜2020年︵+α︶に取材した記事から、今でも参考になりそうな施策などまとめてみました。※ 数値等はあくまで取材当時のものです。1、フリマアプリの検索結果に、あえて﹁売り切れ商品﹂を表示している理由︵メルカリ︶フリマアプリの﹁メルカリ﹂では、検索をかけると販売済みになっている、﹁売り切れ品﹂も表示されるようになっている。あるとき邪魔ではないかと、検索結果から﹁売り切れ品﹂を消してみたら、あらゆる数値︵継続率・購入率など︶が悪化してしまった。実は﹁売り切れ品﹂を置いておくことが、ユーザーに﹁これ買いたかった﹂﹁マメにチェックしとこう﹂と思ってもらう、うまい演出として機能していたのが理由。2、コメント欄のタイムラグを小さくすると、コメント率が改善されて荒れにくくなる︵ミラティブ︶配信アプリの﹁ミラティブ﹂では、コメント欄のタイムラグを小さくしたところ、コメント率が改善されたと

ohbarye 2021/02/11

リンク

Tailwind CSSが私には合わなかった理由

ここ1,2年で、Tailwind CSSを使用する人が増えてきました。Tailwind CSSはユーティリティファーストのフレームワークで、いくつかのclassを組み合わせることでUIコンポーネントやレイアウトを簡単に実装できます。 Webデベロッパーによる、Tailwind CSSが私には合わなかった理由を紹介します。 Why Tailwind Isn't for Me by Jared WhiteTailwind CSSについて詳しく知りたい人は、以前の記事をご覧ください。 Tailwind CSSの便利な使い方、レイアウトやUIコンポーネント用のスタイルシートが簡単にまとめて利用できる CSSを書くのが劇的に楽になる！ユーティリティファーストのCSSフレームワーク﹁Tailwind CSS﹂下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得

ohbarye 2021/01/31

リンク

はてなブックマーク

タグ

関連タグで絞り込む (92)

designに関するohbaryeのブックマーク (89)

お知らせ

今週のはてなブックマーク数ランキング（2024年7月第3週）

今週のはてなブックマーク数ランキング（2024年7月第2週）

はてなブックマーク透明性レポート（2024年 2月-2024年4月）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス