Tribute to Nico

Make a onepage website for an artist (we were given a list of six artists) and make it at least 1.500 words long. Use all your front-end knowledge to make sure the user isn’t bored while reading. Also implement two React.js components for more interaction.

Client

Howest & Nostalgie

Team

Laurens Vandevyver

Eva Baete

Duration

2 weeks

Role

Front-end development

Research & UX

To get started with this assignment we started gathering as much information about Nico as we could. We found out about her moddeling carreer, how she joined the velvet underground and about her tragic death. We wanted to tell this story within our website, so with that we started building our wireframes. We also had to think about fun and usefull interactions for our users that would work both on desktop and on mobile.

#2a2ec2

#ff9e1f

#fa2d51

Colours

Because Nico had a lot of drug problems we wanted to resemble this with our colour scheme. The website starts out very white and clean because of her moddeling carreer. Then we move over to a more chaotic, bright and colourful time with the velvet underground where she experimented with drugs. And at the end the website goes completely dark to resemble her death.

Times New Roman

Helvetica

Typography

Because we wanted to supercharge our website with fast loading times and as a fun experiment we used default browser fonts. We used helvetica for all the body copy because this is a higly readable typeface. For our titles we used Times New Roman to give it a more oldschool look and feel.

Reflection

Making a long read website was quite the challenge, we had a giant document which was just text. We broke most of it up on smaller pieces and added a lot of images and white space to make it easy to read. On desktop this worked really well but on mobile it is a really long page to scroll through. Our teaches said we should focus on the desktop experience and just make sure it works on mobile so that's what we did.

More

Can't get enough?

Check out the full case on behance.
See the website live here.

Previous project

Next project