ArchitectenPunt: Exterieur

Platform gefocust op exterieur

Intro

Voor mij lag een goed vormgegeven magazine, maar ook een website die niet overeenkwam hiermee. Ik heb nieuwe ontwerpen gemaakt die aansluiten op het magazine. Deze zijn in samenwerking met mijn programmerende collega's gerealiseerd.

Schakelen tussen platformen

Het platform is opgesplitst tussen Exterieur en Interieur. Je kunt hier via het logo tussen wisselen.

Het magazine is per editie een andere kleur. Deze voeren wij online door. Bijvoorbeeld voor links, buttons, design-icons en highlights.

Design

Homepage

Vanuit de homepage kun je de recentste spotlights en magazine lezen. Via het menu kom je op alle andere pagina's terecht.

Spotlights

Overzicht

Voor de weergave kun je kiezen tussen kleine of grote thumbnails. Door erop te klikken opent de spotlight, met een "vergrotende" animatie, als modal.

Spotlight

Liggende lay-out

Bij het scrollen van de pagina blijft het info-kaartje stilstaan (binnen het lichter aangegeven gedeelte).

Staande lay-out

Bij het scrollen van de pagina blijven de hero/afbeeldingen stilstaan op het scherm. De content scrollt wel.

Magazines

Overzicht

Magazine lezen

Je kunt online door het magazine bladeren.

Magazine aanvragen

Aan de linker zijde zie je onder elkaar de stappen: Bedrijf, Adres, Contact en Versturen.

Icons

Custom made

Om de visuele identiteit consequent door te voeren, heb ik een eigen iconenset ontworpen. Deze icons zijn eenvoudig, herkenbaar en sluiten aan bij de stijl van het magazine.

Navigatie

Switch

Via het logo kun je switchen tussen ArchitectenPunt - Interieur en - Exterieur.

Zoeken

Na het klikken op het zoekglas, kun je zoeken naar een term. Per categorie worden de resultaten weergegeven.

Layouts

Devices

Tijdens de publicatie van een artikel, product of project kunnen klanten kiezen voor de positie van de hero-afbeelding. Deze is staand of liggend. Hieronder zie je hoe deze per device/scherm gebruikt wordt.

Staand zijn deze praktische hetzelfde, dit is vanwege de leesbaarheid van de content. Bij een liggend scherm, zie je duidelijk de verschillen in de layout.