Design ★ 140,637

prototype

Tasarımı hayata geçirmeden önce atılabilir bir prototip oluşturun. İki branch arasında yönlendirme yapın — state/iş-logic sorularını cevaplamak için çalıştırılabilir bir terminal uygulaması veya tek bir route'dan toggle edilebilen birçok farklı UI varyasyonu. Kullanıcı prototip oluşturmak, bir data model veya state machine'i kontrol etmek, UI mockup'ı yapmak, tasarım seçeneklerini keşfetmek istediğinde veya "bunu prototiple", "biraz oynayabilir miyim" dediğinde kullanın.

cd ~/.claude/skills
git clone https://github.com/mattpocock/skills.git skills

Prototip

Prototip, bir soruya cevap veren atılacak koddur. Soru şeklini belirler.

Dalı seçin

Hangi sorunun yanıtlandığını belirleyin — kullanıcının promptundan, çevreleyen koddan veya kullanıcıyla iletişim kurarak:

  • "Bu logic / state modeli doğru hissettiriyor mu?"LOGIC.md. Kağıt üzerinde akıl yürütülmesi zor olan durumlar arasında state machine'i iten küçük bir interaktif terminal app'i oluşturun.
  • "Bu nasıl görünmeli?"UI.md. Tek bir route üzerinde radikal olarak farklı birkaç UI varyasyonu oluşturun; URL arama parametresi ve kayan alt bar aracılığıyla değiştirilebilir.

İki dal çok farklı yapıtlar üretir — bunu yanlış yapmak tüm prototipinizi boşa harcar. Soru gerçekten belirsizse ve kullanıcıya ulaşılamıyorsa, çevreleyen kodla daha iyi eşleşen dalı seçin (backend modülü → logic; sayfa veya component → UI) ve prototipinizin başında varsayımı belirtin.

Her iki dal için geçerli kurallar

  1. Birinci günden itibaren atılabilir ve açıkça bu şekilde işaretli. Prototip kodunu fiilen kullanılacağı yere yakın yerleştirin (prototip yaptığınız modül veya sayfanın yanında) — böylece context açık olur — ancak rahat bir şekilde okuyan birinin prototip olduğunu, üretim olmadığını görebilmesi için adlandırın. Throwaway UI route'ları için, proje zaten kullanan yönlendirme kuralına uyun; yeni bir üst düzey yapı icat etmeyin.
  2. Çalıştırmak için bir komut. Projenin mevcut task runner'ının desteklediği her şey — pnpm <name>, python <path>, bun <path>, vs. Kullanıcı bunu düşünmeden başlatabilmelidir.
  3. Varsayılan olarak persistence yok. State bellek içindedir. Persistence, prototipinin kontrol ettiği şeydir, bağlı olması gereken bir şey değildir. Soru açıkça bir veritabanını içeriyorsa, bir scratch DB'ye veya "PROTOTYPE — beni sil" adıyla açık bir yerel dosyaya erişin.
  4. Cilalaması atla. Test yok, prototipinizin çalışabilir olmasını sağlayan dışında hata işleme yok, abstraksiyon yok. Amaç, hızlı bir şekilde bir şeyler öğrenmek ve sonra silmektir.
  5. State'i yüzeye çıkarın. Her action'dan sonra (logic) veya her varyant değişiminde (UI), kullanıcının neyin değiştiğini görebilmesi için tam ilgili state'i yazdırın veya render edin.
  6. Bittiğinde silin veya absorbe edin. Prototip sorusunu yanıtladığında, ya silin ya da doğrulanmış kararı gerçek koda katın — repo'da çürümeye bırakmayın.

Bittiğinde

Bir prototipten tutmaya değer tek şey, cevaptır. Bunu kalıcı bir yerde yakalayın (commit mesajı, ADR, issue veya prototipinizin yanında bir NOTES.md) ve yanıt verdiği soru ile birlikte. Kullanıcı ise, bu yakalama hızlı bir konuşmadır; değilse, prototip silinmeden önce kararı doldurabilmeleri (veya sonraki geçişte siz) için placeholder bırakın.

Benzer skill'ler

brainstorming Design

Herhangi bir yaratıcı çalışmaya başlamadan önce bunu mutlaka kullanın - feature oluştururken, component inşa ederken, functionality eklerken veya davranış değiştirirken. Kullanıcı niyetini, gereksinimleri ve tasarımı implementation öncesinde araştırır.

obra/superpowers ★ 235,495
finishing-a-development-branch Design

Uygulama tamamlandığında, tüm testler geçtiğinde ve çalışmanızı nasıl entegre edeceğinize karar vermeniz gerektiğinde kullanın - merge, PR veya cleanup seçeneklerini sunarak geliştirme sürecinin tamamlanmasını rehberlik eder.

obra/superpowers ★ 235,495
receiving-code-review Design

Kod incelemesi geri bildirimi alırken, önerileri uygulamadan önce kullanın; özellikle geri bildirim belirsiz veya teknik olarak şüpheli görünüyorsa - performatif anlaşmadan veya körü körüne uygulamadan ziyade teknik titizlik ve doğrulama gerekir.

obra/superpowers ★ 235,495
requesting-code-review Design

Görevleri tamamlarken, büyük özellikleri hayata geçirirken veya merge etmeden önce çalışmanın gereksinimleri karşıladığını doğrulamak için kullanın.

obra/superpowers ★ 235,495
using-git-worktrees Design

Yeni bir feature üzerinde çalışmaya başlarken veya implementasyon planını yürütmeden önce kullanın - native araçlar veya git worktree fallback aracılığıyla izole edilmiş bir workspace sağlar.

obra/superpowers ★ 235,495
using-superpowers Design

Herhangi bir konuşma başlatırken kullanın - skill'lerin nasıl bulunacağını ve kullanılacağını belirler, clarification soruları da dahil olmak üzere HERHANGİ bir yanıt vermeden önce skill invocation gerektirir.

obra/superpowers ★ 235,495
Daha fazla: Design →