d e s i g n d o c u m e n t MELK



Vergelijkbare documenten
Indesign. Pencil - Achtergrond - Visie - Keuzes - Onderbouwing - Toepassing. Photoshop - Achtergrond - Toepassing. Vincent Damen

Project Het Parool. Media, Informatie en Communicatie. Propedeuse. Ontwerpdocument Beeld

Taakleerjaar1 - Dreamweaver

Hoe moet je een prachtige presentatie maken?

Tips en Trucs voor gebruik website

Piotr Tekien. Grafische Vormgeving Revisie portfoliostijl GAR1-B. 3 december 2014 PIOTR TEKIEN HKU GAME ART GAR-1B

WebQuest / WebKwestie. met Word

Digitale Media Handleiding Tool. Judith Koedam DBKV 1A

Het gebruik van jalbum om fotoalbums te maken. Beknopte handleiding

DESIGNBIBLE. 4 Visuele families (inspiratie) Afbeeldingroepen die inspiratie zullen bieden voor mijn vorm geving. 1 De websites van de sportbonden

Screen Design. Inge van Dam CMD2E Screen Design Product page. Inge van Dam CMD2E

Aan de rechterkant is een werkbalk te zien. Onderaan krijg je de instructie: Dubbelklik of sleep een bestand op een plek om iets te plaatsen.

10 foto s van typografische fouten en verbetering: 1 Vietnamees Restaurant Welcome Seafood : Voor verbetering: Na verbetering:

grafimedia CSPE GL Bij dit examen horen een bijlage, uitwerkbijlagen en digitale bestanden.

FAQ (veel gestelde vragen) nieuwe website

De naam van mijn G.I.P. is ZATION. ZATION is een vzw (vereniging zonder winst) die labels maakt voor straatmuziek. De instrumenten die worden

Ontwerpdocument BVA app Ontwerpdocument BVA app

Handleiding Website beheersysteem

XHTML. een website bouwen. Vergelijk met: een huis bouwen. Dadelijk de stenen metselen, of. Hoe begin je er aan? Wat is stap 1?

Ontwerp Portfoliowebsite MMIO 2016

Versie 2. Opdracht deel B Inhoud. Raoul Vos Hogeschool Leiden Studentnummer:

Album samenstellen met behulp van de Hema album software.

Achtergrond en lettertype Opmaak Achtergrond Opmaak Achtergrond Afbeelding in achtergrond

Handleiding Wordpress

mijndomein.nl De Basiscursus Websitemaker

DESIGN DOCUMENT CRIA VSD

Tekstverwerking. Wat gaan we leren? Opdracht: Geavanceerde opmaak. Jen Kegels, Eveline De Wilde, Inge Platteaux, Tamara Van Marcke

Inhoudsopgave. Styleguide Bewust. Pagina 2

FLASHBAY

De Kleine WordPress Handleiding

User Experience Design

Comic Life: Maak een fotostrip in de klas

Documentatie WD32. Christine van Woensel M32

Onderzoek naar product en concurrentie. 10 Concurrenten van webshop Sportieve E-bike. Websites links:

Je kan vanuit de RV SiteBuilder steeds terugkeren naar het controlepaneel, via de knop rechts bovenaan.

Hoe maak ik een fotocollage met Pixlr?

C1D Ontwerp verslag Twan van Beusekom

Website bouwen Blok2 Wat kan wel en wat kan

Handleiding Wordpress CMS

Handleiding Joomla 3.x

Oor website en Lowlands Applicatie. Versie 1.0 / Laura Mentink / V-104 / / 31 Oktober 2013 / Gertrude Lok

grafimedia CSPE KB Bij dit examen horen een bijlage, uitwerkbijlagen en digitale bestanden.

Gebruikershandleiding websitebeheer m.b.v. Wordpress


Uitleg site maken. Stap 2) Nu kiezen we de lay-out. Je kunt het aantal kolommen kiezen. Je kiest nu de eerste. Maar dit kun je later veranderen

Models & Processes Ontwerpdocument Milledoni.nl op mobiel. Laura Mentink V

Snel een begin maken met Front-Page voor een eigen website. blad 1

Handleiding Wordpress

Art/Media & Me Autobiotic Selfie document

Stappenplan voor een werkstuk in Word

Microsoft PowerPoint Basics Hoe maak je een presentatie in Microsoft PowerPoint 2010? Handleiding voor kinderen

Algemene regels. Stappenplan webdesign

Ik wens Jullie veel succes met Google SketchUp

Thinking of Art - Stijl Document

Ontwerptechnieken. MyTV

Alexander Zeh Models & Processes september 2014 Oscar Trapman V1-06

TuinHulp.com, Nieuwe Webservice voor Hoveniersbedrijven 2014

M I K E R U B I O K E R N T A A K

Deze week: - Bespreken 2 websites - kleur - MBTI - Opdracht wat moet er voor volgende week af zijn?

Een veld (field) (geel omkaderd) is een vakje en omdat er gewone tekst instaat is dit dus een "tekstveld"

Tekenen! met frank daenen. Deze handleiding hoort bij de lezing Boeken en Potloden van Frank Daenen.

3. MAAK JE KAART MET GOOGLE MAP

ActiveBuilder Handleiding

Piotr Tekien. Grafische Vormgeving 10 Slechte logo s/typografie verbeteringen. Oktober 2, 2014 GAR1-B PIOTR TEKIEN HKU GAME ART GAR-1B

WordPress Handleiding

Museumbezoek onder Studenten

Inhoudsopgave. Inleiding 3. Mijn artfiact 3. Proces 4. Mijn beoordelingsblad en presentatie 5. Autotic Selfie eindproduct (ware grootte) 6

grafisch ontwerp voor nieuwe en andere media

Promotieplanning Darren Arendse

Handout Bloggen. Les 1: Het maken van een Wordpress Blog

Stap 2 Je template invullen

Bloggen met blogdirect

Design Document If This Then That. HSP moodlight Liad Damhuis G&I1B Game Art

Growth & Reflection. Opleverdatum: 18 juni 2014

Virgo + WPS Office. Tabletproject

VinniePlace helpdesk.vinnieplace.nl

Wat je moet weten over jouw website. Berichten

Vragen en antwoorden. 1. Hoe krijg ik mijn filmpje op YouTube?

Wat is SketchUp? 10. Hoofdstuk 1: SketchUp starten 12

Hoe maak ik een PowerPoint-presentatie?

Wat is evenwicht? Kan dat een bewegend kunstwerk zijn? Wat is een mobile?

6. Indexatie: Zijn de verschillende pagina s binnen de site geïndexeerd door Google?

TIME-TRACKING GROUPING

10 voorbeelden van slechte of onduidelijke visuele communicatie

Starten met Weebly is eenvoudig : je gaat naar Als je een nieuwe gebruiker bent moet je eerst registreren aan de linkerkant :

10 onderdelen die niet mogen ontbreken in een online briefing

FAQ. Responsive Design. Auteur Tim Ariesen Serviceteam Fulfilment Allrounder Datum Versie 1.0

Stappenplan, hoe voeg ik mijn IFRAME toe aan Facebook?

Onderzoek naar producten en concurrentie Shop till you drop

Inleiding. - Teksten aanpassen - Afbeeldingen toevoegen en verwijderen - Pagina s toevoegen en verwijderen - Pagina s publiceren

1. Open het programma KompoZer Het grote witte vlak is een nog lege webpagina. Deze gaan we nu van inhoud voorzien.

Je hebt voordat we beginnen de volgende programma s nodig:

Handleiding Concrete5 website. Outbound Media

Samenvoegen met Word en Excel 2010

193 Albelli/Hema Windows

Web Presence Builder. Inhoud

Workshop Eenvoudig Websites Maken Werkboek

Transcriptie:

designdocument MELK

melk moet een identiteit krijgen zowel inhoudelijk als visueel in dit document is het ontstaan van het visuele gedeelte weergegeven

Dit is een inhoudsopgave 4-19... logo 20-34... website

concept een thuis voor kunst met een ruw randje

het huidige melk logo dit logo is gemaakt door een lokale ontwerper als tijdelijk logo voor publicaties

voordat er schermen aan te pas komen moet er worden geschetst en geknipt

hier is te zien dat het om voorwerpen achter het papier gaat de linkse is met munten de rechtse is met een mandarijn schil wat niet zo goed te zien is

hier is een vaste vorm omstaan woorden door het gebruik van een aantal omschrijven die melk zouden kunnen gegumd het woord melk is er vervolgens uit

vergelijkend design onderzoek het merendeel van de instanties had een typografisch logo *alle designs en de volledige conclusie zijn te vinden in het vergelijkend design onderzoek

ieder groeplid een logo ontwerpen en ik koos voortypografisch toen hier vervolgens mee gewerkt werd kwam er ook naar voren dat mijn hand schrift verbeterd moest worden vervolgens heb ik om typografie en handschrift te verbeteren een cursus gevolgt en gewerkt aan technieken voor handschriftverbeteren kalligrafie

serendipistische vondsten dat veel oude melk labels een sierlijke eerste letter hadden

met zowel vorm als kleur typerend waren voor de jaren waarin het goed ging met de fabriek dat deze tegeltjes

de omtrek van de fabriek een M kan worden

melk omgedraaid werk is

heel veel logo dit zijn de eerste ontwerpen ze zijn vooral voortgekomen uit de oorspronkelijke tegels gevonden in de fabriek de overige zijn geinspireerd door typografische elementen van oude melk labels en andere weer puur expirimenteel de ontwerpen hiernaast zijn voortgekomen uit de kleur en vormen van de fabriek ook staat het melk werk ontwerp hier het ontwerp met de uitlopende k is als associatie voor de schoorsteen van de fabriek maar is niet verder ontwikkeld omdat de fabriek geen grote schoorsteen meer heeft

erg stijl vol na het lezen van een boek over de kunststroming de stijl hier is vooral kleur en eenvoud terug te vinden maar later ook woorden die melk zouden kunnen omschrijven zoals de schetsen

echt heel veel woorden deze woorden zijn samengesteld door melk samen te vatten dit is gedaan omdat melk zo veel bevat dat een simpel logo te weinig is om alles weer te geven de kleur rood is gebruikt omdat dat een kleur is die er uit springt en waarvan in de ontwerpen hi. ernaast het woord melk gemaakt kan worden de streep ernaast is gezet voor uitlijning

nog meer? ja. hier zijn de woorden wat verfijnd en zijn de pastel kleuren van de tegels in verwerkt de linker streep die eerst als uitlijning diende is nu ook aan de andere kant toegepast als deel van het beeldmerk het zijn de muren van melk alles wat er te lezen is speelt zich dus af binnen de muren van melk

finallogo-43.png dit is het uiteindelijke logo waarin de kleuren pastelkleuren zijn en melk centraal staat na presentatie aan opdrachtgever is niet voor dit logo gekozen maar wel de overzichtelijke mani. er van noteren dit wordt in de website toegepast

de website(schetsen) begonnen met een sitemap en noteren wat er op moet komen en technische gegevens zoals grootte Maar ook de layout kwam aan de orde die moest strak en simpel worden

de website(illustrator) aan de hand van de schetsen zijn in illustrator de eerste mockups gemaakt

er kwam een ontwerp waar de naamgeving van melk zou verschijnen met een rollover zoals hier te zien is Het bleek niet overzichtelijk te zijn en vervolgens kwam er een tweede ontwerp bij ontwerp 2 is de originele naamgeving al te zien en zou alles op een pagina moeten passen het ontwerp onder heeft lichte verf spetters en is gepresenteerd en goedgekeurd door de opdrachtgever

bij dit ontwerp zou de muis een kwast volgen waardoor je door de hele website tekent het zou aansluiten aan de verfspetters maar werd te veel en ook de verfspetters zijn weg gehaald.

de website(uitwerken) De website had een eerste layout die ervoor zorgde dat er niet gescrold hoefde te worden maar dat alles op een pagina te zien was

in deze layout zou er veel informatie op een stuk moeten waardoor er eigenlijk niet zulke grote afbeeldingen op kunnen. dit is er jammer voor bijvoorbeeld de sfeerimpressie van het restaurant er moet ook nog een kleur komen bij een rollover zodat elk onderdeel zijn eigen kleur heeft verder had deze website ook nog een browserfill waardoor de ruimte naast de website grijs werd en er een kader om de website kwam

het volgende ontwerp had een witte browserfill en geen stroke om de website heen waardoor hij wat rustiger werd er is ook genoeg ruimte gemaakt voor afbeeldingen voor sfeerimpressie door de diashow die aangeklikt kan worden deze grote afbeeldingen zijn een belangrijk punt want mensen die niet bij melk zijn geweest moeten hierdoor aangetrokken worden daaronder is nog ruimte onder de afbeeldingen het logo van melk is een directe link naar home en staat linksbovenin omdat mensen daar het eerste kijken en daar het logo verwachten de rechterkant is leeg omdat daar weinig focus ligt Bron: Frankwatching.nl

de website(uitwerking 2) het logo van melk staat nu fixed aan de zijkant wanneer naar beneden gescrold word blijft hij zo staan maar aangezien de pagina direct te zien moet zijn zonder scrollen is dit niet een goede oplossing maar wel een andere plaatsing van het beeldmerk van melk ook de letters worden wit wanneer er een rollover is wat er nu nog aangepast moet worden is een titel met de originele naam van melk en de eigen kleur samen met een aantal passende afbeeldingen van melk die de sfeerimpressie moeten geven

ruimte voor titel in eigen kleur diashow informatie over het onderdeel

Wat vervolgens toegevoegd moest worden was een facebook logo waar mensen melk leuk kunnen vinden en op de hoogte blijven van nieuws de oude layout is weer gebruikt en het ruwe randje is toegevoegd

de website(final) OP de home page is meteen een slide show te zien voor een sfeerimpressie info bevat een contact formulier voor vragen en bezoeken bevat een link naar 9292 en heeft een google maps plugin het magazine opent in de site zodat er nog steeds makkelijk genavigeerd kan worden

Eten heeft een menu waarop een foto en informatie over de gerechten te zien is de lounge bevat een sfeerimpressie en informatie film heeft een programma waarin de films te zien zij die gaan draaien en die komen en slapen bij melk heeft ook een sfeerimpressie met een contact formulier voor reserveringen

Ten slotte smuk deze heeft een oude plattegrond van marrum op de achtergrond omdat de inwonders van marrum en omstreken dat zullen herkennen Verder heeft elke pagina een link naar het magazine en een link naar facebook het melk logo is een directe link naar home

de website(mobile version) Bijna 50 procent van al het internet verkeer gaat via mobile daarom moet er ook voor melk een mobiele versie komen van de website er staat geen grote afbeeldingen in en zal een snel menu hebben met alleen noodzakelijke informatie de mobiele website bevat onderaan ook een link naar de website en facebook