30 vibe coding -kehotetta, jotka voit kopioida (taulukko)

Parhaat vibe coding -kehotteet ovat lyhyitä, täsmällisiä ja käyttäytymisestä: kuka sovellusta käyttää, mitä hän voi tehdä, mitä se tallentaa ja miltä se näyttää. Alla on 30 kehotetta, jotka voit kopioida ja liittää, ryhmiteltynä vaiheen mukaan ensimmäisestä rakennuksesta julkaisuun. Korvaa [hakasulkeissa] olevat osat omilla tiedoillasi.

Ne toimivat missä tahansa tekoälysovellusrakentajassa tai koodausagentissa. Jos haluat perustelut niiden takana, pidempi oppaamme miten kirjoitat kehotteita tekoälysovellusrakentajille selittää periaatteet. Tämä sivu on taulukko.

Miten taulukkoa käytetään

• Aloita yhdellä ensimmäisen rakennuksen kehotteella, käytä sitten muita yksi kerrallaan.
• Testaa jokaisen kehotteen jälkeen. Käy muutos läpi ennen seuraavan lähettämistä.
• Säilytä se, mikä toimii. Useimmat tässä olevat jatkokehotteet päättyvät "pidä kaikki muu samana" syystä.
• Liitä tarkka teksti. Virheviestit, painikkeiden nimet ja ruudulla olevat sanat voittavat kuvaukset aina.

Ensimmäisen rakennuksen kehotteet

Nämä määrittävät sovelluksen muodon. Jokainen nimeää käyttäjät, toiminnot, datan ja ulkoasun.

1. Yksinkertainen seuranta

Rakenna minulle [tapa]-seuranta. Voin lisätä [tavan] nimellä ja värillä, rastittaa sen kerran päivässä ja nähdä 30 päivän ruudukon sekä nykyisen putkeni. Tallenna kaikki niin, että se on yhä tallessa päivityksen jälkeen. Siisti, minimalistinen ulkoasu, joka toimii puhelimella.

2. Pienyrityksen varaussivu

Rakenna varaussivu [kampaamolleni]. Asiakas valitsee palvelun ([leikkaus 30 min, väritys 90 min]), päivämäärän ja vapaan aikavälin [klo 9:00 ja 18:00 välillä] ja antaa sitten nimensä, puhelinnumeronsa ja sähköpostinsa. Kaksi ihmistä ei voi varata samaa aikaa. Tarvitsen yksityisen ylläpitosivun kirjautumisen takana, joka listaa tulevat varaukset päivittäin.

3. Sisäinen työkalu

Rakenna tiimilleni sisäinen työkalu, jolla seurataan [laitelainoja]. Jokaisella kohteella on nimi, koodi ja tila (saatavilla, lainassa, rikki). Henkilökunta kirjautuu sisään, voi lainata kohteen itselleen ja palauttaa sen. Näytä taulukko, jota voi suodattaa tilan mukaan, ja historia siitä, kenellä kohde on ollut.

4. Laskeutumissivu odotuslistalla

Rakenna yksisivuinen verkkosivu [tuotteelleni: ateriasuunnittelusovellus kiireisille vanhemmille]. Etusivulla otsikko, yhden lauseen alaotsikko ja sähköpostirekisteröityminen. Sen jälkeen kolme hyötyä, lyhyt osio siitä, miten se toimii, ja UKK. Tallenna rekisteröitymissähköpostit tietokantaan ja näytä lista yksityisellä ylläpitosivulla.

5. Asiakasportaali

Rakenna asiakasportaali [suunnittelustudiolleni]. Jokainen asiakas kirjautuu sisään ja näkee vain omat projektinsa, tilanteen, minun lataamani tiedostot ja kommenttiketjun. Kirjaudun ylläpitäjänä ja näen kaikki asiakkaat. Asiakkaat eivät saa koskaan nähdä toistensa dataa.

6. Laskuri tai tarjoustyökalu

Rakenna tarjouslaskuri [siivousyritykselleni]. Syötteet: makuuhuoneiden määrä, kylpyhuoneiden määrä, lisäpalvelut (uuni, ikkunat, jääkaappi) ja tiheys (kertaluonteinen, viikoittain, kuukausittain). Näytä hinta vaihtuvien valintojen mukaan erittelyn kanssa. Hinnat: [liitä hinnastosi]. Lisää painike, joka lähettää tarjouspyynnön minulle sähköpostilla.

Suunnittelukehotteet

Käytä näitä ennen isoa ominaisuutta tai kun et ole varma, miten jotain kuvataan.

7. Suunnittele ennen rakentamista

Ennen kuin kirjoitat mitään koodia, kuvaa selkokielellä ne näkymät, jotka rakennat, dataa, jota tallennat, ja päätökset, joita tarvitset minulta. Odota minun OK:ta.

8. Muuta sekava idea ensimmäiseksi versioksi

Tässä on ideani: [liitä muistiinpanot]. Ehdota pienintä ensimmäistä versiota, joka on silti hyödyllinen, 5–8 luettelokohdassa. Listaa, mitä jättäisit myöhemmälle ja miksi.

9. Kysy, mitä puuttuu

Mitä kysymyksiä kehittäjä kysyisi minulta ennen tämän rakentamista? Kysy ne yksi kerrallaan ja tiivistä sitten vastaukseni lyhyeksi määritykseksi.

10. Tarkista iso muutos ensin

Haluan lisätä [tiliryhmät, joissa useat ihmiset jakavat yhden työtilan]. Selitä, mitä täytyy muuttua datassa, näkymissä ja oikeuksissa, ja mikä voi hajota. Älä muuta vielä mitään.

Ulkoasukehotteet

11. Aseta selkeä tyyli

Muotoile sovellus uudelleen: lämmin luonnonvalkoinen tausta, tumma teksti, yksi korostusväri [#1F6F50], pyöristetyt kulmat, väljä tila ja moderni sans-serif-fontti. Säilytä asettelu ja jokainen ominaisuus täsmälleen ennallaan.

12. Kopioi viitteen tuntu

Tee kojelaudasta rauhallisen talousseurantasovelluksen tuntuinen: paljon tyhjää tilaa, isot ja lihavat luvut, pienet harmaat otsikot ja yksi yksinkertainen kaavio ylhäällä. Älä kopioi minkään brändin logoa tai tekstiä.

13. Korjaa puhelinasettelu

375 pikseliä leveällä puhelimella [Tilaukset-sivun] taulukko vierii sivusuunnassa ja painikkeet menevät päällekkäin. Muuta jokainen rivi pinotuksi kortiksi pienillä näytöillä. Älä muuta työpöytäasettelua.

14. Tyhjä, latautuva ja virhetila

Lisää [Projektilistaan] kunnolliset tilat: ystävällinen tyhjä tila painikkeella ensimmäisen projektin lisäämiseen, latausluuranko tietojen latautuessa ja selkeä viesti uudelleenyrityspainikkeella, jos lataus epäonnistuu.

15. Oikealta vasemmalle -tuki

Lisää käyttöliittymästä arabiankielinen versio täydellä oikealta vasemmalle -asettelulla. Suuntaa osoittavat kuvakkeet kääntyvät; numeroiden ja päivämäärien pitää käyttää kielialueen muotoa. Pidä englanti oletuksena.

Data- ja ominaisuuskehotteet

16. Tee datasta pysyvää

Tällä hetkellä datani katoaa, kun lataan sivun uudelleen. Tallenna se oikeaan tietokantaan ja pidä nykyiset näkymät toimimassa samalla tavalla.

17. Lisää kirjautuminen

Lisää rekisteröityminen ja kirjautuminen sähköpostilla ja salasanalla. Jokainen käyttäjä näkee ja muokkaa vain omia [merkintöjään]. Näytä käyttäjän sähköposti yläpalkissa uloskirjautumispainikkeen kanssa.

18. Lisää roolit

Lisää kaksi roolia: ylläpitäjä ja jäsen. Ylläpitäjät voivat lisätä, muokata ja poistaa [tuotteita]; jäsenet voivat vain katsella niitä. Pakota tämä palvelimella, ei pelkästään piilottamalla painikkeita.

19. Lisää haku ja suodattimet

Lisää [yhteystietolistan] yläpuolelle hakukenttä, joka täsmää nimeen, yritykseen tai sähköpostiin kirjoittaessani, sekä suodatin [tilalle]. Säilytä nykyinen lajittelujärjestys.

20. Lisää tiedostojen lataus

Anna käyttäjien liittää enintään [5] kuvaa kuhunkin [ilmoitukseen], enintään [5 Mt] kukin. Näytä esikatselukuvat ilmoituksessa ja suurempi näkymä klikattaessa. Vain omistaja voi poistaa omat kuvansa.

21. Tuo taulukkolaskennasta

Lisää Tuo-painike, joka ottaa CSV-tiedoston sarakkeilla [nimi, sähköposti, puhelin, muistiinpanot], näyttää esikatselun ensimmäisistä 10 rivistä ja antaa vahvistaa ennen tallennusta. Ohita rivit ilman sähköpostia ja kerro, montako ohitettiin.

Virhekehotteet

22. Raportoi virhe selkeästi

Kun klikkaan [Tallenna muokkauslomakkeessa], näen viestin "[tarkka virheteksti]" enkä muutos tallennu. Odotettu: muutos tallentuu ja palaan listaan. Etsi syy, selitä se yhdellä tai kahdella lauseella ja korjaa sitten.

23. Pysäytä korjaussilmukka

Olemme yrittäneet korjata tätä kolme kertaa, eikä se yhä toimi. Lopeta koodin muuttaminen. Listaa kolme todennäköisintä syytä, miten kukin tarkistetaan ja mikä niistä mielestäsi on.

24. Kumoa sivuvaikutukset

Viimeisin muutoksesi korjasi päivämäärävalitsimen, mutta [sivupalkki] katosi. Palauta sivupalkki täsmälleen entisellään ja säilytä päivämäärävalitsimen korjaus.

25. Selitä ennen muuttamista

Selitä, miten [kassan loppusumma] lasketaan nyt, askel askeleelta, osoittaen mukana olevat tiedostot. Älä muuta mitään.

Testaus- ja tarkistuskehotteet

26. Reunatapaukset

Listaa 10 tapaa, joilla todellinen käyttäjä voi rikkoa [varauslomakkeen]: tyhjät kentät, hyvin pitkä teksti, tuplaklikkaukset, kaksi ihmistä samaan aikaan, väärät aikavyöhykkeet. Testaa jokainen ja korjaa, mikä epäonnistuu. Raportoi, mitä muutit.

27. Tiivistä viimeaikaiset muutokset

Tiivistä selkokielellä kaikki muutokset, jotka teit viimeisissä [viidessä] vaiheessa, ja merkitse kaikki, mikä voi vaikuttaa olemassa olevaan dataan.

Turvallisuuskehotteet

Yhdistä nämä sivuun onko vibe coding turvallista?.

28. Tarkista datan käyttöoikeudet

Tarkista palvelinkoodi: voiko kirjautunut käyttäjä lukea tai muuttaa toisen käyttäjän [tietueita] vaihtamalla tunnusta pyynnössä? Näytä, missä käyttöoikeus tarkistetaan, ja korjaa aukot.

29. Tarkista paljastuneet salaisuudet

Listaa jokainen API-avain, salasana tai tunnus, jota tämä sovellus käyttää, ja missä kukin on tallennettu. Varmista, ettei yksikään ole selaimessa ajettavassa koodissa tai tiedostoissa. Siirrä ne salaisuuksiin, jos ovat.

Julkaisukehotteet

30. Ennen lanseerausta -tarkistus

Aion julkaista tämän oikeille käyttäjille. Käy se läpi tarkastajana: rikkinäiset linkit, puuttuvat sivujen otsikot ja kuvaukset, lomakkeet ilman validointia, hitaat sivut, konsolivirheet ja kaikki, mikä näyttää keskeneräiseltä puhelimella. Anna lista tärkeysjärjestyksessä ja korjaa sitten viisi tärkeintä.

Kehotteet, joita kannattaa välttää

Jotkin kehotteet tuottavat luotettavasti huonompia tuloksia:

• "Tee siitä parempi." Miten parempi? Nimeä näkymä ja muutos.
• "Korjaa kaikki." Tekoäly muuttaa paljon, etkä tiedä, mikä liikkui.
• "Käytä [kirjastoa] ja [kehystä] ja [mallia]." Ellei sinulla ole syytä, kuvaa käyttäytyminen ja anna työkalun valita pino.
• "Tässä API-avaimeni: …" Älä koskaan liitä salaisuuksia chattiin. Käytä työkalun salaisuusasetuksia.
• Kymmenen ominaisuutta yhdessä viestissä. Jaa ne osiin.

Kehotteista tavaksi

Muutaman projektin jälkeen sinulla on omat versiosi näistä. Säilytä ne muistiinpanona ja käytä uudelleen ne, jotka toimivat. Mythex muistaa myös, kuka olet ja miten työskentelet projektien välillä, joten toistuvat mieltymykset, kuten tavallinen tyylisi tai pinosi, siirtyvät mukana ilman uudelleen kirjoittamista.

Jos jumitat ensimmäisen kehotteen kanssa, ilmainen sovelluskehotteen generaattori muuttaa yhden rivin ideasi laajemmaksi lähtökohdaksi. Ja nähdäksesi, mitä nämä kehotteet tuottavat käytännössä, lue vibe coding -esimerkit tai liitä kehote 1 tekoälysovellusrakentajaan ja vaihda hakasulkeet omaan ideaasi.

Kysymykset