STACK MAP — 設計図 / ブループリント
技術ドキュメント / アーキテクチャ図サービスの LP。CAD の図面を真似て、グリッド線・寸法表記・タイトルブロックで構成しました。
開発者向け SaaS や、技術ドキュメント / アーキテクチャ可視化サービスの LP です。技術系プロダクトでよくある「ダーク + 紫グラデ」を避けて、紙の図面っぽい無機質さで攻めました。
こんな方に向いています
- 開発者を顧客にした SaaS
- API / インフラ / オブザーバビリティ系のプロダクト
- 「中身を理解した上で買ってほしい」技術プロダクト
構成
タイトルブロック → ヒーロー → SVG アーキテクチャ図 → スペック表 → レイヤー定義(L1 / L2 / L3) → CTA。背景は方眼紙、タイトルブロック・寸法線・座標表記で図面の体裁を保っています。
live preview
プレビュー
related
関連するサンプル
IT・テック の他のサンプル、または 1 ページ完結 LP の似た構成のサンプルです。
Tech Blog orca
IT・テック · 白・コード色・モノスペース 2026-05-07
Tech Blog orca
技術記事を継続的に積み上げていくスタートアップ向けの開発ブログ CMS サンプル。タグフィルタとシリーズ表示を備えた構成です。
タグフィルタシリーズRSS / Atomコードハイライト
IT・テック · ボールド・グラデ・大胆・ピンク × 紫 2026-05-05
TILT Creative — ボールドな広告代理店
尖った広告代理店・クリエイティブブティック向け。ピンクと紫のグラデと巨大文字で、攻めの姿勢を視覚化したサンプルです。
大文字キャッチケーススタディ 4 件サービスメニューメンバー
IT・テック · Bento ・ カラフル ・ モダン ・ ダーク 2026-05-05
Stack Studio — Bento グリッド
SaaS の機能紹介サイトを、Apple 風の bento(弁当)グリッドで構成したサンプルです。各カードを違うサイズ・色・グラデで配置して、1 画面で世界観を伝えます。
Bento HERO数字カード機能 3 枚コードブロック
IT・テック · バウハウス・原色三色・幾何学・グリッド 2026-05-05
KREIS Inc. — バウハウス原色
デザインシステム会社のサイトを、バウハウスの三原色と図形(円・三角・四角)で組んだサンプルです。Helvetica 風の太いサンセリフと厳密なグリッドで構成しています。
サービスプロセスケースファクト
このサンプルが気になったら
このサンプルをベースに、文章・写真・色味をお客さまの事業に合わせて作り直してご提供できます。
まずは 30 分の無料相談で、構成のすり合わせから始めましょう。