|
Vandaag gaan we het design maken voor het online magazine. Met behulp van Adobe Photoshop zetten we het wireframe van dag 4 om in een daadwerkelijk design.
Photoshop
We maken gebruik van Adobe Photoshop om een design te maken. Er zijn ook alternatieve manieren om een website te designen, door bijvoorbeeld de website direct in HTML en CSS vorm te geven. Echter, het volledig ontwerpen van een website in Photoshop dwingt ons om direct keuzes te maken dit zorgt ervoor dat het bouwproces van de website sneller en soepeler verloopt.
GIMP
Hoewel Adobe Photoshop een geweldig pakket is, is het ook een kostbaar pakket. Gelukkig bestaat er ook een gratis alternatief, namelijk: GIMP. GIMP is nog niet zo uitgebreid als Photoshop maar de basis is redelijk gelijk en het wordt met elke release steeds professioneler.
Kleuren
Een van de belangrijkste onderdelen van design is kleur. Meestal worden de kleuren aangehouden van een bestaand logo of huisstijl. Wanneer dit niet het geval is dan is het belangrijk een kleurenschema te kiezen dat aansluit bij de doelgroep van de website. In het geval van www.pokermagazine.nl gaan we uit van het traditionele kleurenschema van de speelkaarten, namelijk: zwart, rood en wit.
Wanneer je meer moeite hebt bij het vinden van een geschikt kleurenschema zijn er verschillende tools en websites die het kiezen van de juiste samenstelling makkelijker maken:
- http://kuler.adobe.com/ - Op deze website kun je inspiratie opdoen voor verschillende kleurenschema's. Ook is het mogelijk zelf een kleur in te voeren en Kuler geeft dan suggesties voor bijpassende kleuren.
- http://www.colourlovers.com/ - Deze website heeft een grote database met allerlei verschillende samenstellingen van kleuren. Gebruikers kunnen stemmen op favoriete schema's en commentaar geven.
Afbeeldingen
Een andere belangrijk onderdeel van het design zijn de afbeeldingen. Een afbeelding kan het design maken of breken. Een goede afbeelding is mooi en heeft een bepaalde raakvlak met het onderwerp van de website. Google images is voor veel mensen een startpunt om op zoek te gaan naar een afbeelding. Dit raden wij echter af. Deze afbeeldingen zijn meestal van slechte kwaliteit en aan veel afbeeldingen zitten rechten verbonden. Wij maken gebruik van Istockphoto. Deze website heeft veel mooie foto's tegen een relatief lage prijs (tussen de 1 en de 10 dollar per foto). Soms is het even zoeken naar een geschikte foto maar wanneer deze goed past bij het design is het de moeite meer dan waard. Een andere populaire bron voor stockfoto's is gettyimages. Deze foto's zijn van betere kwaliteit maar de prijs ligt ook fors hoger (meer dan 100 dollar per foto is niet ongebruikelijk).
Budget afbeeldingen
Als er geen budget is voor afbeeldingen dan zijn er ook nog gratis alternatieven. Op Creative Commons kan gezocht worden op werk (waaronder foto's en video's) dat rechtenvrij is. Een andere optie is stock.xchng. Hier zijn gratis stockfoto's te downloaden, maar de kwaliteit laat soms te wensen over.
Designen voor Joomla!, hou het simpel
Bovenstaande paragrafen hebben voornamelijk te maken met de algemene aspecten van het designen. Het designen voor Joomla! zorgt echter voor een extra uitdaging. Omdat Joomla! de pagina's automatisch opbouwt heeft bouwer van de website weinig tot geen controle over de manier waarop deze worden opgebouwd. Het is daarom belangrijk om rekening te houden met de manier waarop Joomla! dit doet. Wij gaan er hier van uit dat dit één van de eerste Joomla! websites is die je volledig zelf ontwerpt en bouwt. Daarom is het verstandig het design simpel te houden zodat het bouwen van de website straks niet te ingewikkeld wordt. Zodra er meer ervaring is opgedaan met het bouwen van websites in Joomla! wordt het makkelijker om in te schatten hoe bepaalde design elementen vertaald kunnen worden in een template.
Kijk dus goed naar de standaard template die behandeld is op dag 3 en naar de opbouw van de verschillende modules. Probeer deze indeling zoveel mogelijk aan te houden in het design. Dit is hieronder ook terug te zien in het design van http://www.pokermagazine.nl:
Deze standaard indeling is bij Poker Magazine bijvoorbeeld aangehouden bij het laatste nieuws en login. Deze zijn aangehouden zoals ze door Joomla! gegenereerd worden in de standaard template. Hierdoor wordt het bouwen van deze elementen straks makkelijker.
Geen beperkingen
Hoe meer websites je met Joomla! bouwt des te meer invloed je krijgt op de look en feel. In het begin is het voornamelijk aftasten wat wel en niet kan binnen Joomla!, maar als je eenmaal meer ervaren bent merk je al snel dat Joomla! weinig beperkingen heeft wanneer het gaat om het design.
Samenvatting
Vandaag hebben we een design gemaakt voor ons online magazine. Dit design gaan we overmorgen omzetten naar een echte Joomla! website. Hiervoor moeten we echter eerst de ins en outs weten van een Joomla! template en daarom kijken we morgen naar de Joomla! template tags.
 |
