mcpField
H
hairline-adopt

hairline-adopt

github.com/lucasmarkesデザイン・UI3.1k2.0k 回インストール2 週間前に更新
リポジトリ

hairline-adopt について

hairline-adoptは、渡されたSVGの絵をもとに、Hairlineのエンジン上で立体のパーツから新しいフィギュアを作るスキルです。SVGをなぞったり動かしたりせず、絵の特徴とパーツを保ち、hairline-createでジェスチャーを検討して仕上げます。

主な機能

  1. 01SVGの絵を読み取りパーツを特定
  2. 02Hairline上で対象を立体として再構築
  3. 03SVGをなぞらず特徴を維持
  4. 04hairline-createでジェスチャー案を作成
  5. 05確認済みフィギュアの引き渡し

活用シーン

  1. 01アイコンをHairlineフィギュアに変換
  2. 02ロゴを立体フィギュアとして再構築
  3. 03イラストからフィギュアを作成
  4. 04絵をもとにしたフィギュアにポインターの動きを追加

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/lucasmarkes/hairline --skill hairline-adopt

インストール後、Claude Code で/hairline-adoptを入力して読み込まれたか確認します。

詳細

Hairline:描画を採用する

描画を持つ人が、それをHairlineのフィギュアとして生き生きと動かしたいと考えています。このスキルは描画を読み取り、Hairlineのエンジン上で立体としてオブジェクトを作り直し、ジェスチャーを与えます。SVG自体をアニメーション化することも、トレースすることもありません。描画からアイデンティティを受け継ぎ、プロポーションや各パーツを備えたフィギュアを新たに作ります。

必要なもの

  • 1つの.svgファイル:アイコン、ロゴ、イラストなど。複数ある場合は、一度に1つのフィギュアを作成し、どれから始めるか尋ねます。
  • オプションとして、ポインターにどのような動きをさせるかの指定。指定がなければ、コンセプトでジェスチャーを提案します。

実行すること

ファイルのパスと、その後に続けて、ジェスチャーについて本人が話した言葉をそのまま添えて、/hairline-createを呼び出します。このスキルのステップ0で描画を読み取り、オブジェクトとそのパーツを確定します。続いてコンセプトでは、それらを維持したままジェスチャーに違いをつけます。ジェスチャーの指定がある場合は、形状と読み取り結果に違いをつけます。以降の制作、チェック、引き渡しはすべてこのスキルが行います。

伝えること

コンセプトを提示する際は、まず1行で、描画をどのように読み取ったか、どのパーツを維持したかを伝えます。読み取りについて本人から訂正があった場合は、コンセプトを作成する前に、その人の解釈に合わせて読み直します。

描画が他者の所有するマークである場合は、引き渡し時にその旨を伝えます。ページには他社のマークが表示されており、公開するかどうかを決めるのはその会社です。

コメント