このページは個人的なメモ書きです。何かあればご連絡ください。

https://github.com/baku89/glisp-ui

「ぼくの考えたさいきょうのデザインツールUIコンポーネント」を作る。

• スキームをカスタマイズできるようにする（とりとめのない自由）
  • ターミナルやコードエディタのためのカラースキームの統一規格であるBase16をベースにする
    • プレビューサイト
    • あくまで文字ベースのツール向けなので、枠線の色などGUIツールには不向き
      • ローコントラストになりがち
• Principles
  • 入力の並列化
  • プログレッシブな詳細度
    • Tooltipを用いる
  • 「見た目の簡潔さより、見分けがつくこと」
    • 「アクション」と「インプット」の区別
      • Runwayは、数値入力、レイヤーの揃えを実行するボタンとが見た目状区別できない
        • 
      • Figmaはフラットデザイン以降のイディオムに頼りすぎな印象
        • 

- 立体感はダサいが役に立つ  
- 可変である領域とそうでない領域の区別  
- 値の組は一つのボックスに収める（最大3つまで）  
  - 例）タプル  
  - Rectはどうする？  

• 絶対量/相対量の両方を設定できるようにする
  • ドロップダウンを上下ドラッグでトゥイーク
  • チェックボックスの代わりにスイッチ（中央を押すとトグル、両端をクリックで絶対値の設定）
• 最小の操作距離で
• 不可欠なアクションは省略しない
• スライダーは極力解像度を高めるために横幅を最大にとる

調査

Framer, Runway, Figmaについて、UIコンポーネントで使われているスタイルを調査する。

フォントは?

• Runway, Figma: 11px. Inter
• Framer: 12px, Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol