Sådan designer HTML5-spil
HTML5 og udtrykket "cross platform" er buzz ord og med god grund. Teknologien fungerer for smartphones, tablets, laptops og desktops. Agenturer elsker konceptet, fordi enhver webdesigner, der kender HTML, vil forstå HTML5. Hvad betyder det for dig , webdesigneren?
- Flere projekter involverer HTML5
- Flere projekter drejer sig om interaktivitet
- Oprettelse af erfaringer for slutbrugeren at interagere med
Kernen i denne interaktive oplevelse er afslappede spil. I denne artikel vil jeg vise dig, hvordan du kan få en eftertragtet spildesign oplevelse. Målet? Har "HTML5 spil design" på dit resumé.
Jeg spiller spil, men ...
Det er en almindelig fejlagtighed blandt webdesignere, at designe spil er en specialiseret færdighed. Du behøver ikke at deltage i spildesignskolen, til at designe spil. Alle kan designe spil. Lad os først bryde dette ind i dele. Opbygning af et spil kræver 3 store trin:
- design af spillet
- Produktion af visuelle og lydaktiver
- programmering af spillet.
Som webdesigner er den nemmeste måde at få erfaring på, ved at designe selve spillet. For punkt 2 og 3 har et agentur typisk allerede udpegede kunstnere og programmører til jobbet. Hvis du er god til kunst, er 2 meget opnåelig. I forbindelse med denne artikel, lad os diskutere trin 1. Hvor begynder vi endda? Her er 10 trin, som hver spildesigner skal gennemgå for at tjene deres striber.
1) Spil masser af afslappede spil
Har du en iPhone eller Android-telefon? Gå til App Store, gå til top gratis spildiagram. Download og spil hvert eneste spil på top 20 listen. Gør dette mindst en gang hver anden uge.
Mens du spiller, være opmærksom på, hvordan hvert spil er designet. Hvilke animationsteknikker og mekanik bruger den? Er tegnene skilt ud for dig? Har det haft en historie? Hvad fik du til at føle? Efter 20-30 spil, begynder du at spotte mønstre.
Du vil bemærke, at nogle spil i kernen virkelig handler om det samme. F.eks. Clash of Clans, Boom Beach og Hay Day handler om at bygge, forsvare og angribe.
Du vil bemærke, at simple spil, som Flappy Bird eller Swing Copters fokuserer på virkelig hårde udfordringer, som kan gentages et uendeligt antal gange.
Du vil bemærke, at nogle spil fokuserer på overbevisende historiefortælling med omhyggeligt designet tegn.
Du vil også bemærke et par ulige indie spil, det er bare ligefrem tilfældigt men virkelig sjovt!
2) Lav skitser ... masser af dem
Lav skitser af de ting, du kan lide fra de spil, du spillede. Skits tegn, kort, menuer og brugergrænseflader. Var der en bestemt karakter, som du kunne lide? Var der en vis vinkel af spillet, der gjorde dig begejstret?
Her er et tegn kaldet 'Matt'. Han er en kedelig kontormand, limet til sin stol:
3) Lav flowdiagrammer
Flow diagrammer beskriver trin-for-trin proces af spillet. De beskriver det punkt, hvor brugeren starter spillet, hele vejen til vigtige begivenheder, som f.eks. Sejr eller tab. Start med enkle diagrammer som dette:
Når du får mere selvtillid, gentager du på dit enkle flow for at gøre mere komplekse strømme.
4) Skriv et spil design dokument
Brug det, du lærte fra trin 1-3, til at designe og skrive et forenklet spildesigndokument (GDD). En GDD fortæller i grunden læseren, hvad spillet handler om.
Hurtigt eksempel: Lad os tage vores karakter kaldet "Matt" i Trin 2, og lad os sige, at han er fanget i et kedeligt kontorjob. Han vil undslippe. Fangen er, han kan kun gøre det fra sin rullestol. Vi har lavet en pæn skitse af spilskærmen. Det viser en labyrint af kontoret skriveborde conspiring for at blokere Matt's flugt.
Som et eksempel har vi gjort målet med spillet enkelt. Naviger kontor labyrinten for at undslippe det.
Det er det for en meget grundlæggende GDD. Her er det komplette rutediagram for vores spil Escape the Office .
5) Træn din tankegang på tværs af platformen
Med HTML5-spil koger meget af det til at kunne køre spillet på forskellige skærmstørrelser effektivt. Her er en oversigt over forskellige enheder, vi har på markedet: iPhone, iPad, iPod Touch, Samsung Galaxy Note3, Samsung Galaxy Tablet, Google Nexus, LG, Xiaomi, Windows Phone, Windows Laptop, Mac, listen fortsætter og fortsætter ... Latterligt ? Alligevel er det, hvad store virksomheder gør. Som en selvstændig designer, hvordan designer du et spil, der passer til forskellige skærmstørrelser?
- Løs spillet orientering. Design dit spil sådan, at det fungerer enten i portræt tilstand eller kun liggende tilstand.
- Find den mest almindelige spilopløsning, der fungerer for de fleste enheder. Oprethold aspektforholdet. Derefter skaleres op eller ned afhængigt af enhedens opløsning. Vi finder aspektforhold på 3: 4 (portræt) eller 4: 3 (landskab) mest populære og effektive.
- Design letvægts, casual spil. Gå ikke til det store 3D MMO spil. I stedet skal du gå for sjov, lyse afslappede oplevelser. Spillet kan være så simpelt som whacking mol, eller hoppe rundt om platforme. Alt under himlen er fair game (ingen ordspil beregnet).
- Træk altid høj opløsning kunst. Mindst 2048px bredt som en basislinie. Det er nemmere at nedskalere end det skal opskalere.
6) Start pitching
Spørg din virksomhed (eller klienter), hvis de er interesserede i nogen spilrelaterede projekter. Vis dem dine designs. Pitch dit hjerte ud. Gå dem gennem GDD'en.
Din første spil ide tonehøjde vil ikke være som Shark Tank, være sikker på! Chancerne er, de vil tildele et lille budget til spillet. Hvis der ikke er noget budget, fortsæt med at lave bedre design og nå ud til andre virksomheder. Hvis du har ressourcerne, skal du finansiere dine egne spilprojekter på den billige.
7) Find en programmør
Når du først har et budget, skal du begynde at lede efter programmører, der specialiserer sig i spiludvikling. Vis dem dine designs, del budgettet og fortæl dem visionen. De fleste spiludviklere er meget hjælpsomme. Hvad du har brug for er en programmør, der er velbevandret i HTML5-spil. Denne person skal vide, hvordan man kode noget, der skaler fint for alle former for formfaktorer. Diskuter "cross platform mindset" med programmereren.
8) Slibe
Udviklingen af spillet selv vil tage uger, om ikke måneder, i første omgang. Der vil være blodsved og tårer, men det vil alle være værd at opleve. Det er meget vigtigt at holde rækkevidden af dit spildesign meget, meget lille, i hvert fald til dit første projekt.
9) Afslut projektet
Nøgleordet her er "finish" projektet. Ofte, som designere, ønsker vi et perfekt spil. Nul fejl. Smukt designet spil kunst, med ideelle regler. Kast det tankegang ud af vinduet. Gå for "god nok". Slip spillet ud i det vilde. Intet siger det som et spil, der er levende, i brugernes hænder. Du kan altid polere spillet efter lanceringen. Færdig er bedre end perfekt.
10) Mål feedback
Tjek brugerens svar på dit spil. Brug gratis værktøjer som Google Analytics til at spore dit spils synspunkter, afspilninger og begivenheder.
Hvis du designer spil for at få social media opmærksomhed, skal du analysere Facebook-likesna, Tweets og Instagram Likes. Undersøg hvordan brugerne reagerede på dit spil.