Nelly Camacho

UX/UI & Web Designer

For this part of the project, I had to focus on the visual design, including an explanation of the possible logo and brand, as well as the choice of colour and typography.

Tinto at Five

I have decided to name my project “Tinto at Five“. Tinto means black coffee in Colombia. Coffee is one of the products that we, as Latin Americans, are the proudest of. But it also has another meaning; in some countries, Tinto means red wine, which is a very social drink, so it is a nice twist. Also, five o’clock in the morning or the afternoon is a great time to have a coffee, as you are just starting your day (normally, most days start very early in the morning in South America) or finishing the working day.

Therefore, I decided that Tinto at Five would be the perfect name for a project that tries to connect different cultures, extend people’s social circle, and realise that there is a great community that will be more than happy to welcome new communities into theirs.

Logo and brand creations

Logo design

Shapes meaning

I read some interviews of how Latin Americans felt when coming to the U.K. to get some common things that they had to face when adapting to a new culture. I concluded that every person who came to this country, and any new country, had to be brave enough to be out of their comfort zone. Thanks to this conclusion, I draw a small circle (meaning the comfort zone) inside a bigger circle (meaning the learning and growth zone), then I drew a dashed line going out of the circles to show the path that every person had to take when coming into a new country. And finally, I drew a heart as the goal every migrant would like to achieve.

Colours meaning

For the small circle, I used blue as it shows reliability which is something you normally feel when you are in your comfort zone. For the bigger circle, I chose yellow to show a mix of feelings, as this colour can have different meanings depending on the person looking at it; it can be a happy colour or a frustrating one. For the dashed line, I chose red as it is a bold colour, showing passion and excitement. For the heart, I chose green, as it is a colour that normally represents a new beginning and hope.

Most of these colours are primary, meaning that I have to be very careful when putting them together. Also, some considerations have to be kept in mind when using the colour green, as people with colour vision deficiency could find it difficult to spot if it is put together with red, yellow or blue.

Moodboard

Moodboard

I created a mood board to show what feelings I would like the users to have when visiting my website. Some images show relaxing scenarios as I don’t want to overwhelm the users with heavy information and pop ups, as I want them to feel comfortable with the amount of information and the chosen layout. Also, some images have bright colours, as I want to keep some hints of a bright colour pallette. And other images have food as I that is the style of photographs I would like to take when protographying products.

Layout

Wireframes

I am not sure how I would like the layout to look like, at least not yet. Therefore, I did some wireframes to understand how some of the elements could look like, and I found it difficult to know what would be the best place for the navigation, so this is something that I need to experiment more to be happy about it. Also, I created a style tile to show the way the logo and the typography could look on screen.

Conclusion

Even though more research is necessary, I feel like I am challenging convention, as most of the websites I have seen about the Latin American community use monochrome colour palettes. They tend to overwhelm the user with a huge amount of information, making people outside the Latin American community not feel comfortable navigating their websites.

Feedback

  • The Colour scheme must be improved by not using so many bright colours and not using mainly primary colours.
  • The typography for the headings was too square compared with the typography chosen for the website’s name.
  • The logo should look more natural, maybe handpainted, instead of using a digital programme for it.
  • Keep in mind the website’s tone when writing the information, and consistency must be kept in all the different aspects.