Site voor de Game studio

Klant

Ontwikkelingsstudio voor computergames opgericht in 2007. De studio produceert games van verschillende genres die wereldwijde erkenning krijgen.

Een taak

Het doel van de site is om een game-ontwikkelingsstudio te presenteren voor professionals op dit gebied. De site vertelt over het bedrijf en vacatures, toont projecten en het kantoorleven.

Doelgroep – game-ontwerpers en game-ontwikkelaars, productmanagers, analisten, marketeers op dit gebied.

Ontwikkelingstijd: 6 maanden

Geschatte kosten van zo’n project: 10.000 euro

Team: ontwerper, art director, 2 designers, motion designer, 3 developers, projectmanager.

Probleem en uitdaging

Het ontwerp van de nieuwe site moet werken voor de reputatie van het bedrijf, de interesse van professionals op het gebied van game-ontwikkeling vergroten en nieuwe medewerkers aantrekken. De concurrentie om personeel op de ontwikkelingsmarkt is groot en er zijn niet zoveel stijlvolle professionals. Daarom is het simpelweg plaatsen van vacatures op vacaturesites onmisbaar. Het is noodzakelijk om de omvang van projecten te demonstreren, de waarden van de studio en de voordelen van samenwerking met hen uit te dragen.

Het ontwerp van de website moet de essentie en waarden van hun team visueel weerspiegelen. De studio wil de site immers gebruiken om specialisten aan te trekken met een vergelijkbaar wereldbeeld, bereidheid om mee te doen aan projecten, bestaande te verbeteren en nieuwe games te ontwikkelen.

Concept ontwerp

De samenwerking begon met de ontwikkeling van een ontwerpconcept. De meta-taak van deze fase is om onze ideeën te synchroniseren met de visie van de klant.

De eerste hypothese bij het maken van het concept was als volgt:

Het publiek van de site is geïnteresseerd in “het proces bespioneren”: hoe de personages worden beschreven, projecten worden besproken, games worden getest. Hieruit ontstond het idee om de achtergrond te maken van de sitevideo’s van medewerkers aan het werk. De sitenavigatie werd gespeeld met iconen uit het merkboek: bij het scrollen door de sitepagina’s verandert een punt in het logo in een van de iconen. Voor meer impact werden de pictogrammen in 3D weergegeven. Voor elke sectie hebben we het meest geschikte pictogram gekozen en een titel geschreven die het pictogram en de essentie van de sectie met elkaar verbindt.

Meer over het concept

De klant hield van onze manier van werken en ideeën. De studio kocht dit concept uit, maar vroeg om het idee opnieuw vorm te geven: de site lichter maken en de iconen uit het merkboek achterwege laten.

In het eerste concept vond de klant de structuur van de hoofdpagina en het werk met typografie leuk – grote koppen op elk scherm. Dat gezegd hebbende, wilden ze een visueel meer luchtige site met kunst uit hun games. In de tweede iteratie hebben we verschillende ideeën gepresenteerd op basis van de opmerkingen over het eerste concept. Uit de voorgestelde opties hebben we het derde concept gekozen: grote typografie op volledig scherm, aangevuld met personages uit de games van de studio.

DEFINITIEF CONCEPT

De nadruk in het uiteindelijke concept ligt op grote koppen en scherm-voor-scherm presentatie van site-onderdelen. Bovendien lijken de titels van het scherm te verdwijnen en het idee van de schaal van de studioprojecten over te brengen, grenzen en ontwikkeling overschrijdend. De structuur van de hoofdpagina is gevormd op basis van de analyse, die game-ontwikkelaars kan interesseren voor hun werk. Dit zijn grote projecten die bekend zijn bij game-ontwikkelaars, een comfortabel kantoor, werkomstandigheden en een teamsfeer. Op basis hiervan werden de secties “Projecten”, “Over ons”, “Vacatures” en “Contacten” geïdentificeerd.

Engineering en ontwerp

In deze fase hebben we de logica van de interactie met gebruikers, de structuur van de informatiepresentatie grondig nagedacht en interactieve elementen uitgewerkt. Alles is in constante samenwerking met het team van de klant.

SITE STRUCTUUR

Bij het scrollen presenteert de hoofdpagina de secties van de site en geeft een algemeen beeld van de studio. Op elk scherm hebben we belangrijke informatie uit het overeenkomstige gedeelte van de site gehaald. Door op het scherm te klikken, komt de gebruiker op een pagina met gedetailleerde informatie.

NAVIGATIE

Bij het ontwerpen van sitenavigatie was het belangrijk om rekening te houden met interactie- en navigatiepatronen. In game-interfaces verschillen ze van typische webinterfaces. Klanten en doelgroep van de site zijn eraan gewend dat elementen zich op een bepaalde manier gedragen.

Een van de commentaren was: “Het is niet duidelijk dat de hoofdpagina moet worden gescrolld.” We vroegen ons af waarom zo’n voor de hand liggende actie niet werkt voor het hele klantteam. Het bleek dat game-ontwikkelaars verschillende mechanismen van gebruikersinteractie met de interface gebruiken, dus scrollen is niet de meest bekende interactie voor hen. Als gevolg hiervan hebben we de visuele nadruk op het muispictogram met een pijl aanzienlijk verhoogd en geanimeerd om zeker de aandacht van elk publiek te trekken.

Het gemak van de interactieve interface werd samen met de medewerkers getest, zij zijn tenslotte de doelgroep. Het hele team was bij het proces betrokken: ze controleerden de bruikbaarheid van de site, bespraken met collega’s, vatten terugkerende opmerkingen samen en gaven ons feedback. Dit verhoogde de goedkeuringsvoorwaarden, maar het bleek een site te zijn die handig is voor het publiek.

BINNEN SECTIE PAGINA’S

De binnenpagina’s ontwikkelden het idee met grote typografie en gamekarakters in de krantenkoppen. De structuur van elk van deze pagina’s is ontworpen rekening houdend met de informatie die van belang is voor gebruikers in deze sectie. We praten bijvoorbeeld over het bedrijfsleven en de sfeer in het team, publiceren functiebeschrijvingen voor sollicitanten.

De sectie “Projecten” presenteert alle games die zijn uitgebracht gedurende de 13 jaar dat de studio werkt. Projecten bevinden zich op een tijdlijn – een tijdlijn: van de nieuwste tot de projecten die enkele jaren geleden zijn gemaakt. Door op de naam van het spel te klikken, wordt de gebruiker naar een gedetailleerde beschrijving van de projecten geleid.

PROJECT PAGINA’S

De taak is om de schaal van elk van de projecten te demonstreren, om een idee te krijgen van het werk van het bedrijf onder gebruikers, om, indien mogelijk, het ontwikkelingsproces te tonen. Voor deze pagina’s is de inhoud belangrijk: tekst en afbeeldingen die geplaatst moeten worden. Om dit te doen, hebben ze een gedetailleerde vragenlijst samengesteld om te begrijpen wat informatie over games is: kunst, geschiedenis en schetsen van de gefaseerde creatie van spelwerelden en personages. De blog vertelde hoe je inhoud moest voorbereiden voordat de site werd ontwikkeld en waarom je dit moest doen.

Resultaat en aanbevelingen

Het resultaat is een website die de omvang van de projecten van de studio laat zien en de voordelen van werken in hun team. Zo’n site vereist veel aandacht voor detail en een ervaren team van niet alleen ontwerpers, maar ook frontend-ontwikkelaars die alle ideeën kunnen implementeren: ze correct lay-out, animatie van elementen opzetten en alles tot op de pixel controleren.

Als u een website nodig heeft waarin de beeldcomponent van ontwerp belangrijk is, let dan bij het kiezen van een aannemer op de volgende punten:

Geef de voorkeur aan een bureau of webstudio boven individuele specialisten. Ten eerste stelt teamwerk je in staat om meer interessante en unieke ideeën te bedenken. Ten tweede hebben de ontwerpers en ontwikkelaars in het bureau al samengewerkt, waardoor het werk harmonischer zal zijn en er minder obstakels zullen zijn in het projectproces.

Bekijk het portfolio van het team om te zien hoe jouw smaak overeenkomt met hun benadering van design.

Bereid van tevoren inhoud van goede kwaliteit voor: afbeeldingen, foto’s, tekst. Het is tenslotte inhoud die van website-ontwerp een zakelijke tool maakt. En het is om hem heen dat de structuur van de site en elke pagina wordt opgebouwd. Een ander voordeel van een studio of bureau is trouwens dat ze je helpen bij het maken van de inhoud die je nodig hebt.

Cool design gaat niet alleen om de uitstraling, maar ook om de gebruiksvriendelijkheid. Let daarom op of het team ontwerpcompetenties heeft op het gebied van gebruikerservaring.