Design

Het gehele design is overgenomen van de orginele Game Buddy vanuit Muhammets individuele project.

De Game Buddy app is voor gamers gemaakt, de bedoeling is dat we gamers aantrekken tot gebruik van deze applicatie. Er is daarom gekozen voor een donkere achtergrond met accentkleuren. De Styling is voor de rest minimalistische en er zullen iconen gebruik worden om de meeste dingen aan te geven.

Als team hebben we de gehele style overgenomen van de orginele Game Buddy, we hebben echter enkele aanpassingen gedaan.

Kleurgebruik

De Game Buddy applicatie maakt gebruik van een bepaalde kleuren pallet die past bij de doelgroep. De achtergrond is donkergrijs van kleur en de hoofdkleur donkelgeel. Daarnaast zijn er nog een aantal accent kleuren die hieronder vermeld zijn, die ook in de CSS vermeld zijn onder de root.

:root{
    --wit: #ffff;
    --zwart: #000;
    --grijs: #232323;
    --lichtgrijs: #d3d3d3;
    --geel: #fdae37;
    --groen: #95e8b1;
}

Lettertyp

In de Game Buddy applicatie zijn twee lettertypes toegepast van het platform Google Fonts. Namelijk het lettertype: Kanit en Ubuntu. Deze twee zijn gekozen omdat ze goed bij het concept en de doelgroep passen, namelijk gamen en gamers. Daarnaast geven ze een moderne look aan de applicatie.

Iconen

Binnen in de applicatie zullen vooral iconen gebruikt worden om bepaalde elementen aan te tonen, zoals profiel en verwijderen. De iconen die gebruikt zijn voor Game Buddy zijn afkomstig van Font Awesome, die het mogelijk maakt om de iconen in te laden.

Mobiel design

Er is gekozen om de applicatie alleen voor mobile te ontwikkelen, dit omdat het voor alle gamers van elk platform toegankelijk moet zijn. Dus niet alleen maar voor pc gebruikers die op een browser kunnen navigeren, ook voor gamers die gebruik maken van een console.

Omdat het concept voor de applicatie wel ontwikkeld wordt op de browser is er een CSS propertie meegegeven van max-width: 600px;. Vervolgens heeft de body een lichtgrijze achtergrond gekregen, zodat dit te onderscheiden is met de daadwerkelijke applicatie.