Schetsen Visitekaartje & definitieve schets Uitleg Visuele Hierarchie - TessaViergever/Profile-Card-Tessa-Viergever GitHub Wiki

Deze opdracht is done als:

✔ 1. Je schetsen staan in de wiki van je visistekaartje repository, per schets is beschreven hoe de visuele hierarchie is toegepast ✔ 2. Je definitieve schets staat in de wiki van je visistekaartje repository met uitleg hoe de visuele hierarchie is toegepast


O.b.v mijn nieuwe kennis over visuele hiërarchie, heb ik naar mijn eerdere schets gekeken en een onderscheid gemaakt in relevantie van de informatie. Belangrijkste info: Naam, profielfoto, Wie ben ik? (🙋‍♀️) Belangrijke details: Wat vind ik leuk? FDND, Toekomst.(❤️🧩🔮) Achtergrondinfo: socials (evt. QR?)

  1. Hieronder een aantal schetsen van mijn visitekaartje waarin ik gepoogd heb om elementen van visuele hiërarchie toe te passen:

SchetsVisueleHierarchie(Deel1)

(1,2,3,4 = Li. boven -> Re. boven) 1.Foto + Naam staan in het midden en zijn groter. De positie/kleuren van de achtergrond foto zorgen voor extra focus op de profielfoto. "Wie ben ik" info staat links bovenin (waar mensen vaak beginnen met lezen), de detail info op de 3 overige plekken. De socials klein gemaakt en onder mijn naam gezet. 2. Een blok met alle info gecentreerd op de pagina met een (blurred?) background foto. De profielfoto heb ik bovenin het blok gezet, daaronder groot de naam. Daaronder wederom links bovenin de "wie ben ik" info en de overige 3 plekken voor achtergrondinfo. Helemaal onderaan socials in het klein. Gekozen om de info te rangschikken van boven naar beneden omdat mensen (meestal) van boven naar beneden lezen. 3. De bovenste helft bevat Li. grote profielfoto en rechts de "wie ben ik"info. Daaronder groot de naam. Het onderste deel vind ik te gedetailleerd en juist afleidend van de info bovenin. 4. Bovenin de naam in contrasterende kleuren, dit valt extra op. Vervolgens de profielfoto met een gekleurde rand eromheen. Rondom de zijkanten v/d PF staat de "Wie ben ik" info. Daaronder de belangrijke details info in een lichter gekleurd blokje. Daaronder de achtergrond info in een nog lichter gekleurd blokje. (5,6,7,8 = Li. onder -> Re. onder)* 5. Wederom de profielfoto bovenin, met een achtergrondfoto die de pf highlight. Onder de pf groot de naam. Daaronder "wie ben ik" info. Daaronder een blokje met de detailsinfo. Helemaal onderin de backgroundinfo (had minder opvallend gemogen, vind het op mijn schets nog vrij groot ivh met belangrijke detail info erboven. 6.Blokjes over de hele lengte van het scherm, van boven naar beneden. Rand om pf bovenin + achtergrond foto om de focus op de pf te leggen. Daaronder een groot blok met witruimte + naam, witruimte maakt de tekst erin opvallender. Daaronder het icoontje voor "wie ben ik" info. Daaronder de icoontjes voor de belangrijke detail info. Daaronder in het klein de socials. 7.Schuine lijn met groot naam en er links naast een pf. Groot bolletje met wie ben ik info. Kleinere bolletjes met belangrijke detail info. Kleinste bolletjes zijn voor achtergrondinfo/socials. 8.Witruimte rondom. Groot foto + naam in het midden. Daaronder groot een QR

SchetsVisueleHierarchie(Deel2) 9. Re. bovenin groot Partial profielfoto. Li. bovenin de wie ben ik info. Daaronder een blokje met groot naam. Daaronder 3x icoontje met belangrijke detail info. Daaronder in het zelfde blokje, kleine social icoontjes.

  1. Hieronder de definitieve schets van mijn visitekaartje.

DefinitieveSchetsVisitekaartjeVisualHierarchy

Ik heb gekozen om de profielfoto bovenin te plaatsen, met een achtergrondfoto om de pf te highlighten. Daaronder in grote opvallende letters de naam. De "wie ben ik" info onder de naam. En daaronder in 3 losse blokjes de detail info (die open kunnen klappen, dan zie je de inhoud, nu alleen icoontjes). Helemaal onderin in het klein de socials.