Opdracht 1
2C_0888632_van_ Ruth_Colin_ Opdracht_1_Compleet
Deliverable 1 Visuele merken concurentieanalyse
Merkanalyse
2C_0888632_van_ Ruth_Colin_ Opdracht_1_Analyse_ ING_BANK
Concurentieanalyse
2C_0888632_van_ Ruth_Colin_ Opdracht_1_Analyse_ ING_BANK
Wanneer is een productpagina goed? - Belangrijkste informatie boven aan - Duidelijke productomschrijving - Detailkenmerken - Productafbeeldingen - Relevante andere producten - Call to action button
Wat zijn visuele kenmerken van een productpagina? - Overzichtelijk - Grote banner boven aan de pagina - Tiles - 1-4 kollomen - Duidelijke structuur
Hoe worden beeld, typografie en vorm gebruikt?
- In de banner meestal een afbeelding van het product zelf, persoon of een emotie. - Grote titels - Er wordt veel gebruik gemaakt van titels, subtitels en body tekst - Gebruiker wordt direct aangesproken - Meeste productpagina’s zijn rechthoekig vormgegeven en zeer gestructureerd - Veel wit - Aantal basis kleuren die overal terug komen
Welke elementen verbeteren een productpagina? - Knoppen en kaders die de aandacht direct aantrekken - Sfeerimpressies - Elementen waar gebruikers zich in kunnen herkennen - Elementen die al in andere touchpoints zijn gebruikt
Deliverable 2 Schetsen en Styleguide
Schetsen
1. Header links (Particulier, Personal banking, Private banking en zakelijk) 2. Call to action knoppen voor (home, producten en financeel fit) 3. Zoekveld 4. Titel (Eenmaal mobiel, altijd mobiel) 5. Subtitel (Als u de app gebruikt, wilt u nooit meer anders) 6. Call to action knoppen voor de appstores 7. iPhone afbeelding met app screen 8. Call to action scroll knop + Overzichtelijk + Duidelijk te zien waar de app te downloaden is + Verschillende groottes in tekst
1. Header links (Particulier, Personal banking en zakelijk) 2. Zoekveld 3. Titel (Functies) 4. Functie icons met tekst 5. Call to action scroll knop + Overzichtelijk overzicht functies + Veel wit ruimte + Header kleiner (onepager effect)
1. Header links (Particulier, Personal banking en zakelijk) 2. Zoekveld 3. Titel (Downloaden en installeren) 4. Doorlopende tekst (Het downloaden en installeren op uw smartphone of tablet is heel eenvoudig. In enkele stappen heeft u de app gedownload en bent u aangemeld. U kunt dan direct aan de slag met mobiel bankieren.) 5. 3 iPhones met afbeelding van app 6. Call to action scroll knop 7. Footer + Overzichtelijk + Veel witruimte + Verschillende font groottes
1. Header links (Particulier, personal banking, private banking en zakelijk) 2. Header 3. Zoekveld 4. Titel ( Altijd en overal uw geldzaken regelen) 5. Subtitel (Download de gratis mobiel bankieren app.) 6. Call to action Appstores knoppen 7. iPhone afbeelding met app screen 8. Footer links (Over ING, ING in english, Veilig bankieren, Privacy en cookies en Disclaimer) 9. Footer + Overzichtelijk + Duidelijk te zien waar de app te downloaden is + Verschillende groottes in tekst + Grote afbeelding iphone + screen
- Te leeg - Te simpel - Niet de identiteit van ING - Weinig tekst
- Te druk - Bovenste deel pagina is geordend - Onderste gedeelte vind ik niet echt geslaagd, oogt als verouderd design (App carousel)
+ Overzichtelijke manier van functies + Compositie interessant, leuke manier om functies te weergeven rondom de device.
1. iOS Appstore call to action knop 2. Google Play Store call to action knop 3. Scroll knop 4. Call to action navigatieknoppen
Styleguide
Styleguide ING Bank Icons
€
Afbeeldingen
Touch ID
Inge
Apple Watch
Overboeken
Creditcard
Adresboek iPhone 6 375 x 667px
Buttons Download in de
Download in de
APP STORE Home
GOOGLE PLAY Producten
Financieel fit
Kleuren
#FC5600
Typografie
#3A3A3A
Rockwell Bold - 36pt
Rockwell Regular - 20pt Rockwell Light - 14pt
#FFFFFF
Deliverable 3 Productpage
iPhone 6 375 x 667px
Particulier
Home
Personal Banking
Producten
Private Banking Zakelijk
Zoeken binnen ING
Financieel fit
Eenmaal mobiel, altijd mobiel Als u de app gebruikt, wilt u nooit meer anders Download in de
APP STORE
Download in de
GOOGLE PLAY
iPhone 6 375 x 667px
Particulier
Personal Banking
Private Banking Zakelijk
Zoeken binnen ING
Functies
Touch ID
Inge
Apple Watch
Met uw vingerafdruk inloggen en betalingen bevestigen in de Mobiel Bankieren App.
Ontmoet Inge. Ze helpt u met uw bankzaken in de Mobiel Bankieren App.
Hoe laat het is én wat er nog op uw rekening staat ziet u in één oogopslag op de Apple Watch.
Overboeken
Creditcard
Adresboek
Gemakkelijk en snel geld overschrijven naar andere rekeningen.
Bekijk uw creditcard transacties gemakkelijk en snel.
Gemakkelijk transacties uitvoeren vanuit uw adresboek.
€
Particulier
Personal Banking
Private Banking Zakelijk
Downloaden en installeren Het downloaden en installeren op uw smartphone of tablet is heel eenvoudig. In enkele stappen heeft u de app gedownload en bent u aangemeld. U kunt dan direct aan de slag met mobiel bankieren.
iPhone 6 375 x 667px iPhone 6 375 x 667px
iPhone 6 375 x 667px
Zoeken binnen ING
Particulier
Personal Banking
Private Banking Zakelijk
Zoeken binnen ING
Altijd en overal uw geldzaken regelen Download de gratis Mobiel Bankieren App
Download in de
APP STORE
Download in de
GOOGLE PLAY
iPhone 6 375 x 667px
Over ING
ING in English
Veilig Bankieren
Privacy en cookies
Disclaimer
2C_0888632_van_ Ruth_Colin_ Opdracht_1_Compleet