本文へ移動
NNeumorphism UI
ドキュメントスタイリングチャートテンプレート
—
日本語
English한국어简体中文日本語
INSTALLABLE SCREENS

テンプレート

インストールした部品による完成したワークフロー。プレビューと配布ソースは同じです。

サンプルデータ · 2026年9月 · USD。実際のサービスには接続されていません。

成果ダッシュボード

同じ期間と元データで成果を確認。

2026-09-17 – 2026-09-30 · 記録日数: 14 / 14

売上
$60,644.00
訪問
23,778
コンバージョン訪問
1,210
転換率
5.09%

売上と目標

日別売上を通貨で表示します。破線は目標です。

売上: $60,644.00 · 目標: $75,810.00

正確なデータを見る
売上と目標
日付売上目標
2026-09-17$3,682.00$5,064.00
2026-09-18$3,842.00$5,118.00
2026-09-19$4,292.00$5,172.00
2026-09-20$4,542.00$5,226.00
2026-09-21$3,640.00$5,280.00
2026-09-22$4,040.00$5,334.00
2026-09-23$4,142.00$5,388.00
2026-09-24$4,642.00$5,442.00
2026-09-25$4,842.00$5,496.00
2026-09-26$3,890.00$5,550.00
2026-09-27$4,340.00$5,604.00
2026-09-28$4,550.00$5,658.00
2026-09-29$5,000.00$5,712.00
2026-09-30$5,200.00$5,766.00

流入経路の比較

選択期間の経路別合計。棒はゼロから始まります。

訪問: 23,778

正確なデータを見る
流入経路の比較
流入経路訪問コンバージョン訪問転換率
Organic9,4703864.08%
Direct8,0114205.24%
Referral6,2974046.42%

訪問の転換率

コンバージョン訪問数を訪問数で割ります。縦軸は0–100%に固定します。

5.09% · 1,210 / 23,778

正確なデータを見る
訪問の転換率
日付訪問コンバージョン訪問転換率
2026-09-171,557734.69%
2026-09-181,547774.98%
2026-09-191,622865.3%
2026-09-201,612915.65%
2026-09-211,602724.49%
2026-09-221,677804.77%
2026-09-231,667834.98%
2026-09-241,742935.34%
2026-09-251,732975.6%
2026-09-261,722774.47%
2026-09-271,797864.79%
2026-09-281,787915.09%
2026-09-291,8621005.37%
2026-09-301,8521045.62%

欠測日はゼロではなく空白です。訪問数ゼロの転換率は未定義です(—)。

合計は提供された記録のみで完全性を保証しません。期間は最後に提供された日付を基準にします。

01

分析ダッシュボード

↗

期間と経路のフィルター、売上と転換率、正確な表とCSV出力。

ChartRechartsCSV
画面を開く: 分析ダッシュボード

ローカル動作例です。再読み込みで初期化されます。実際の保存先を onSave に接続してください。

WORKSPACE / PREFERENCES

自分らしいワークスペース。

プロフィールを整え、必要な通知だけを受け取りましょう。

公開プロフィール通知設定
AL

Alex Kim

alex@example.com

ワークスペースのプロフィール

公開プロフィール

チームにわかりやすい名前を使ってください。

アカウントとワークスペースのお知らせに使います。

240文字以内で紹介してください。

57/240

通知設定

メンション、担当と重要な変更を通知します。

日々の通知の代わりにまとめを受け取ります。

すべて保存済み

02

設定とプロフィール

↗

入力検証、プレビュー、変更検出、保存失敗からの復旧と取り消し。

FormFieldSwitchToast
画面を開く: 設定とプロフィール

ローカル例です。再読み込みで初期化されます。onSave と onDelete にサービスを接続してください。

WORKSPACE / RECORDS

小さな記録、明確な進捗。

必要な作業を見つけ、内容を整え、次へ進めましょう。

すべてのデータ12
進行中6
下書き4

データ

12 件の結果 · 0 件選択
データ
状態操作
Archived campaignMina保管済み2026-08-20
Content planningMina下書き2026-10-15
Customer onboardingJun進行中2026-10-08
Keyboard navigation auditJun進行中2026-10-14
Legacy welcome screenJun保管済み2026-09-01
ページ 1 / 3

最近の変更

この画面での変更がここに表示されます。

03

データ管理

↗

検索、状態フィルター、並べ替え、ページ移動、選択、作成・編集と削除確認。

Data TableDate PickerSheet
画面を開く: データ管理
AK

Alex Kim

@alexbuilds

Designer and developer sharing small tools, notes, and experiments.

次のリンクへ

5 件のリンク

  • PPortfolioexample.com新しいタブで開きます↗
  • GGitHubgithub.com新しいタブで開きます↗
  • NNewsletterbuttondown.email新しいタブで開きます↗
  • LLinkedInlinkedin.com新しいタブで開きます↗
  • EEmailhello@example.com→

連絡先

hello@example.com

04

リンクハブ

↗

プロフィール、グループ別リンク絞り込み、外部リンク表示、メールコピーの復旧。

External linksClipboard
画面を開く: リンクハブ
Sora Han
主な実績連絡先

独立した仕事 / Seoul

Sora Han

Product designer and front-end developer.

I design focused digital products for people doing complex work.

I work from early product thinking through accessible front-end delivery.

主な実績

WaylineProduct design and front-end2026⌄

A dispatch planning workspace that turns route changes into clear next actions.

課題
Dispatchers needed to distinguish urgent route changes from routine updates.
アプローチ
Mapped planning and dispatch handoffs, then prototyped one shared queue.
提供したもの
Workflow map, interaction prototype, accessible React workspace.
成果
One view of ownership, exceptions and the next action for each route.
LedgerlineProduct design2025⌄

A calm reporting system for finance teams reviewing a busy monthly close.

課題
Reporting assumptions were scattered across tables, slides and messages.
アプローチ
Designed a common review structure with comparable periods and visible definitions.
提供したもの
Reporting model, chart language, reusable review components.
成果
Reviewers can trace each summary back to its source and unresolved questions.
Open IndexWeb design and development2025⌄

An accessible directory for shared tools, datasets and practical guides.

課題
A growing collection of public resources was difficult to browse and maintain.
アプローチ
Organized resources around user tasks and tested search, filters and empty states.
提供したもの
Information architecture, responsive directory, keyboard interaction checks.
成果
A searchable directory with clear categories and maintainable contribution rules.

複雑なワークフローをシンプルにしませんか?

誰が使い、どこに摩擦があり、最初の有用なリリースが何をすべきか教えてください。

メールGitHub ↗新しいタブで開きますLinkedIn ↗新しいタブで開きます

© 2026 Sora Han

先頭へ
05

ポートフォリオ

↗

プロフィール、プロジェクト事例、課題・アプローチ・成果、連絡先リンク。

Case studiesDetailsContact
画面を開く: ポートフォリオ

FIELD NOTES / DESIGN & ENGINEERING

最新の記事

プロダクト、デザイン、フロントエンドの実務から得たメモです。

3 件

  1. Sep 18, 2026Product · 4 分で読めます

    Useful empty states are part of the workflow

    Treat an empty result as a next-action surface instead of a dead end.

  2. Sep 10, 2026Engineering · 6 分で読めます

    Keyboard-first overlays without separate logic

    Use the primitive state model and style its visible states rather than rebuilding interaction.

  3. Aug 29, 2026Design · 5 分で読めます

    Depth without visual noise

    Reserve raised and inset surfaces for state and hierarchy instead of decorating every region.

06

ブログアーカイブ

↗

検索、トピック絞り込み、並び替え、明確な空状態を備えた data-driven 記事一覧。

SearchTopicsSort
画面を開く: ブログアーカイブ
← すべての記事

Design

Why small interfaces age better

A practical case for fewer controls, clearer defaults, and less maintenance.

Sep 12, 2026·5 min read

Small interfaces are easier to understand on the first visit and easier to maintain on the hundredth release.

Start with the boundary

A useful interface begins by deciding what it will not ask the user to manage.

Keep the controls that change the outcome and move rare configuration closer to the moment it matters.

Make the default path obvious

A strong default removes a decision without hiding what happened.

  • Name the primary action precisely.
  • Show the current state beside the control that changes it.
  • Keep advanced choices available without making them mandatory.
すべての記事先頭へ
07

ブログ記事

↗

タイトル、概要、公開メタデータ、セクション、リストを表示する静的記事テンプレート。

ArticleSectionsStatic
画面を開く: ブログ記事

コンテンツワークスペース

ローカルUIの例です。実際の保存は onSave に接続してください。

全記事
3
公開済み
2
未保存
0

記事を編集

更新 12 min

プレビュー
公開済み

September product update

Highlights from the latest workspace release.

This release brings clearer ownership, faster search, and a simpler review queue.

08

ローカル CMS

↗

記事検索、状態フィルター、編集・プレビュー、dirty state、保存失敗からの復旧。

EditorDirty statePreview
画面を開く: ローカル CMS
Neumorphism UI56 UI · 16 blocks · 80 registry items

shadcn 互換のソース Registry

GitHubCredits