Relay — 仕事をつなぎ、余白をつくるRelay — Connect the work. Make room.

小さなチーム向けワークスペース「Relay」の紹介ページを、淡いラベンダーと鮮やかな紫で構成する。冒頭では特大の日本語見出しを全幅にまたがらせ、後半の行を少し字下げする。その下に説明文と静的なワークスペース画面を段違いで配置し、右の画面が左の説明文より一段早く始まる編集的な構図にする。左右二分割のヒーローではなく、横断する文字と不均等な余白で視線を誘導する。プロダクト画面にはサイドバー、進行状況、タスク一覧、小さな完了通知を使う。写真は使わず、機能紹介も簡潔なCSS図形で表す。続いて番号付きの機能紹介を右寄りに配置し、濃い紫の導入案内で締めくくる。細い罫線、小さな等幅英字、読みやすい日本語を組み合わせる。モバイルは見出し、説明文、画面の順に並べ、文字の大小と余白の変化を残す。

Create an introduction page for Relay, a workspace for small teams, using pale lavender and vivid violet. Open with an oversized Japanese headline spanning the entire grid, with its second line slightly indented. Place supporting copy and a static workspace interface on staggered tracks beneath it, starting the interface one visible grid row above the copy. Use spanning typography and uneven whitespace rather than a conventional split hero. The interface includes a sidebar, progress summary, task list, and small completion notification. Use CSS diagrams instead of photography. Follow with right-weighted numbered feature rows and a deep-purple closing invitation. Combine fine rules, small monospaced English labels, and readable Japanese typography. On mobile, arrange the headline, copy, and interface in reading order while retaining varied type scales and spacing.