DESIGN.mdを日本語UIで本当に使える形へ｜hirokaji
jp-ui-contracts を公開しましたAIでUIを作る流れが強くなるほど、逆に目立ってくるものがあります。 それは、日本語の詰めの甘さです。 色はそれらしく見える。 余白もそれっぽく整う。 カードやボタンの形も、かなり上手に出てくる。 でも最後に崩れるのが、日本語です。 見出しの折り返しが苦しい。 本文の行間が浅い。 英語のサービス名が混ざると急に浮く。 フォームだけ窮屈になる。 表の密度が本文のルールを引きずって読みにくくなる。 この違和感は、単に「AIの精度が足りない」から起きているわけではありません。 もっと手前の問題です。 日本語UIの設計契約が、まだ十分に書かれていない。 そこで作ったのが、jp-ui-contracts です。 また、以下の記事が “DESIGN.md とは何か” を定義する総論で、今回の記事は “それを日本語UIでどう実装資産にするか” を示す各論です
Vite入門 - HTMLからTypeScript・React・Tailwind CSSまで - ICS MEDIA
Viteヴィート（フランス語で「速い」の意味）はフロントエンドのビルドツールです。 シンプルなウェブページの作成からReactやVue.jsなどのフレームワークを使ったアプリケーションの開発まで、さまざまな環境で利用できる汎用的で強力なツールです。2026年にリリースされたバージョン8では、パフォーマンスや開発体験がさらに向上しています。 ViteはNext.js・Nuxt・Astroのようなフレームワーク（メタフレームワーク）を使わずに静的サイトやReact・Vue.js等のSPAを開発するために使われます。位置付けとしてはwebpackのようなバンドラーと呼ばれるものに近い存在ですが、それだけではありません。 この記事では、Viteを導入して静的ウェブサイトからTypeScript・React・Tailwind CSS等を組み合わせたアプリケーションまで、快適な開発環境を手に入れる方法
なぜ、優秀なエンジニアは、たかが使い捨てコードの名付けやUIにこだわるのか？
はじめに 優秀なエンジニアほど、短命に見える補助スクリプトや一時的な検証ツールに対しても、名付けやUIを雑に扱いません。表面的には過剰品質に見えることがありますが、実際には逆です。そこにこだわるのは余裕があるからではなく、ソフトウェア開発の本当のコストがどこにあるかを知っているからです。 プログラムというものは、最初から思った通りに動くことのほうがむしろ少ないです。多少なりともバグを含み、想定外の入力や環境差、状態遷移の食い違いを抱えています。したがって開発とは、書く作業以上に、疑い、試し、切り分け、直す作業の連続です。 このとき開発者を最も苦しめるのは、計算量の大きさや文法の難しさだけではありません。実際には、理解しづらい名前、迷いやすい操作、責務の見えない構造といった、認知の摩擦こそが調査と修正を大きく妨げます。だから優秀なエンジニアは、短命なコードであっても、その摩擦を最初から減らそ
CSSのlinear()でUIが軽快になる! スプリングアニメーション活用術13選 - ICS MEDIA
CSSのlinear()関数を使うと動きの自由度が高まります。バネのような動きをするスプリングアニメーションもlinear()で実現できることのひとつ。これを使うと、UIにイキイキとした躍動感を加えられ、ユーザーに軽快な印象や心地よいフィードバックを与えることができます。 linear()で作った動きはCSSトランジションやCSSアニメーションに利用します。ウェブページのどの部品にも使いやすく、ボタンやタブ、トグルスイッチのような小さなUIを心地よく見せたいときに便利です。 この記事では次の内容を紹介します。 スプリングアニメーションを適用したUI演出 linear()の値を調整する方法 スプリングアニメーションのニーズの高まり 汎用的なUI スプリングアニメーションを使ったオリジナルのデモを紹介していきます。まずは小さな部品に役立つ例をみていきましょう。 セグメントボタン セグメントボタ
Mastra入門 - TypeScriptで作るAIエージェント - ICS MEDIA
2022年にChatGPTが登場して以来、AIを活用したツールやアプリが世界的に注目されています。ChatGPTをはじめとしたチャットベースのアプリだけでなく、Claude CodeやGitHub Copilot、Codexなどのコーディングエージェントを活用している方も多いのではないでしょうか？ ChatGPTのおかげですっかり浸透したAIアプリですが、作るためのフレームワークも日々進歩しています。この記事では、TypeScriptでAIエージェントを作れるフレームワーク「Mastraマストラ」を紹介します。 MastraにはAIエージェントを作るための便利な機能があります。次の動画のようなAIエージェントが意外と簡単に作れるのでぜひ体験してみてください！ ▼Mastraの機能の1つであるMastra Studioの画面です。Mastra自体にはUI構築のための機能はありませんが、開発・
WebGPUのシェーダーの文法がほぼRustな理由
WebGPUの初学者が最初にぶつかる壁はWGSL（WebGPU Shading Language）の文法の異質さだと思います。 GLSLやHLSLを書いてきた人間からすると、こういうコードを見た瞬間に「なんだこれは」となる。 @vertex fn vs_main(@location(0) pos: vec3<f32>) -> @builtin(position) vec4<f32> { return vec4<f32>(pos, 1.0); } まんま Rust じゃん。 なぜWebのシェーダー言語がRustの構文を踏襲しているのか。調べれば調べるほど、技術的合理性だけでは説明できない闇が見えてきました。 すべての元凶 -> AppleとKhronosのIP戦争 WGSLは誰も望んでなかった ここが一番大事なポイントです。 WGSLという言語が存在する最大の理由は、Appleが既存のSPI
トランプ大統領、Anthropicを「極左の意識高い系企業」と非難し 政府機関での製品使用を即時停止
ドナルド・トランプ米大統領は2月27日（現地時間）、自身のSNS「Truth Social」への投稿で、米Anthropicを「極左の意識高い系企業」と呼び、政府機関での同社製品の使用を即時停止するとした。Anthropicのダリオ・アモデイCEOが前日、米国防総省（Department of War）が求めているAIの安全対策（セーフガード）撤廃の要求に応じられないと公式ブログで発表したことを受けたものだ。 Anthropicを含む複数の米AI企業は国防総省からAI関連の契約を取り付けている。国防総省はこれらの企業に対し、「あらゆる合法的な利用」に同意し、セーフガードを撤廃するよう要求しているが、アモデイ氏はセーフガードの撤廃は兵士や民間人を危険にさらすため、良心に従って要求に応じないとしている。 トランプ氏は「Anthropicの左翼狂信者は戦争省を強圧し、憲法ではなく彼らの利用規約に
Animations on the Web
How do you craft animations that feel right?Learn the theory and practice behind great animations with this interactive learning experience. Enrollment is closed8,012 designers and engineers have improved their animation skills with this course. The next enrollment opens on January 20th for 10 days. Join the waitlist to get two free preview lessons and behind-the-scenes content every two weeks. No
こういう広告の『閉じる』ボタンをわざとわかりにくくするの、サイト自体が嫌われると思う「ボタンのコントラストが低くて非常に見分けづらい」
白羽瀬 理宇 1/25 西2 二25ｂ @Riu_Shirahase わっっかる！！ しかも最近、従来なら閉じるボタンがあった場所に、広告先へのリンクボタンがあること多くて…… ムキーってなる！ ＞RT 2026-01-28 07:46:52
手軽で高速なフォーマッターBiomeの導入手順 - ICS MEDIA
ウェブのフロントエンド開発では、PrettierやESLint、Stylelintなどのツールチェーンが長らくデファクトスタンダードとして採用されてきました。 一方で、大規模なプロジェクトでは実行速度の遅さがボトルネックとなることがあります。また、設定ファイルの肥大化によってツール間でルールの不整合が発生する点も課題です。 こうした課題に対し、近年ではBiomeバイオームやOxcオーエックスシーといった高速化と統合を掲げる新しいツールチェーンが登場し、注目を集めています。 本記事ではBiomeの導入手順を紹介し、Prettier/ESLint/StylelintやOxcと比較しながら特徴と注意点を整理します。 Biomeとは Biomeは、Rustで実装された高速なフォーマッター兼リンターの統合ツールチェーンです。Prettierとの互換性を意識して実装されており、HTML/CSS、Jav
中国人も台湾人も夜遅くまで働いている 日本人だけが「働き方改革」でいいのか
中国人も台湾人も夜遅くまで働いている 日本人だけが「働き方改革」でいいのか：今、エグゼクティブMBAで重視される日本的経営とは 先日、私はUCLA-NUS EMBA（アメリカ・UCLAアンダーソン経営大学院とシンガポール国立大学が共同で運営するエグゼクティブMBA）のプログラムで上海を訪れました。授業の合間に中国人のクラスメイトに普段の働き方を聞いてみたところ、驚くべき答えが返ってきました。 「夜9時、10時まで残業するのは当たり前。土曜日も出勤することがある」と言うのです。念のため台湾人のクラスメイトにも聞いてみましたが、答えは同じでした。「台湾も似たようなものです。特に繁忙期は土曜出勤が続きます」。 私は日本との違いに愕然としました。日本では「働き方改革」が叫ばれ、残業削減や有給取得が推進されています。しかし、すぐ隣の中国や台湾では、むしろ労働時間が伸びているのです。 1人当たりGDP
Perfectly Pointed Tooltips: A Foundation – Frontend Masters Blog
At the time of writing, only Chrome and Edge have full support of the features we will be using. Let’s start with a demo: Click-and-drag the anchor and see how the tooltip behaves. It will try to position itself in a way to remain visible and avoid any overflow. Cool, right? No JavaScript is used to position the tooltip (except the one for dragging the anchor, which is irrelevant to the trick). Th
Astro is joining Cloudflare
The Astro Technology Company, creators of the Astro web framework, is joining Cloudflare. Astro is the web framework for building fast, content-driven websites. Over the past few years, we’ve seen an incredibly diverse range of developers and companies use Astro to build for the web. This ranges from established brands like Porsche and IKEA, to fast-growing AI companies like Opencode and OpenAI. P
JPG画像をBase64で送るとサイズが33%増えるが、Gzip圧縮すれば「ほぼ元通り」になるという話 - Qiita
当たり前なのではというはてぶが多かったので、画像のファイルフォーマット毎の差異もまとめてみました。 Web APIでJPG画像を送信する際、「バイナリ送信(multipart/form-data)で送るか」「Base64エンコードしてJSONに埋め込むか」で迷うこと、あると思います。 例) multipart/form-data で画像データと、付属パラメータを一緒に送信するサンプル POST /upload HTTP/1.1 Content-Type: multipart/form-data; boundary=----boundary123 ------boundary123 Content-Disposition: form-data; name="user_id" 12345 ------boundary123 Content-Disposition: form-data; nam
ペルソナ 「佐藤美咲」さんの謎｜kodai
時間がない人向けの3行説明LLMを100回ずつ回してペルソナ作ったら「佐藤美咲」に極端に偏った インターネット的にはペルソナと言えば「佐藤美咲」なのかもしれない シンプルな指示でAIにペルソナを作らせるとめっちゃ偏るらしい（論文） 背景AIPMでお馴染み、みやっちさんのAIPMコミュニティ（仮）※ の雑談チャンネルで、同じようなペルソナの名前が頻出することで、ちょっとした話題になりました。 ※ コミュニティ名は2025/12/25時点のもの モデルの学習データが理由なんだろうなとは思ったものの、プロダクトマネージャーたるもの一次情報に当たらねば、ということでどんな名前が出るか検証してみることに。 やり取りその１やり取りその２ 調査の仕方御三家モデルを100回ずつ実行して、どんな名前が出力されるかを調べます。 毎回Webでポチポチするのは辛いので、スクリプト経由でCLIを使って並列実行させる
タイポグラフィCSS
typography.md タイポグラフィ font-family フォントは Web サイトの印象に直結するため、一概にこれが良いとは言えない。 特にこれと言った指定がされていない場合は font-family: sans-serif のみで良い。 Windows 11/10 では 2025 年のアップデートにより Noto Sans JP が標準搭載された。色々と問題があった游ゴシックの呪縛から解放されたのは大きい。 Android はメーカーにより削除されている可能性はあるが、そうでない場合は原則的に Noto Sans CJK JP が適用される。 Mac/iOS はヒラギノ角ゴ ProN が適用される。 アップデートによるフォントの変更の懸念はあるものの、ディスクリシアの方々は UD デジタル教科書体などの読みやすいフォントを設定している可能性があるため、アクセシビリティの観点で
フロントエンド開発の勘所 -複数事業を経験して見えた判断軸の違い-
burikaigi 2026 のスポンサー LT 発表の資料です
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ゲーム開発のゲームエンジン採用率、「Unreal Engine」がついに「Unity」を抜き去ったとの調査結果。ここ1年でUEが一気に引き離す - AUTOMATON
トランプ氏、アンソロピックのAI「連邦政府全体で使用停止」 - 日本経済新聞
The Astro Technology Company joins Cloudflare | Astro
