Brand elements with Illustrator

Nafta’s Sweets is a website that I have programmed as part of my course work at the university, but to get there, I had to do several things beforehand.

First of all I chose a candy store as a business so I named it Nafta’s Sweets.

Secondly I designed the icons that I was going to need inside the web using the Illustrator tool. Therefore, I started thinking about a color palette that would symbolize this business. So I chose a color palette with two main colors, pink that expresses love and sweetness and on the other hand yellow that transmits joy and happiness. I also made use of black and white which are basic colors and help to finish the details.

Then I chose a typography that transmits closeness to the user and this was «Modak Regular» together with «Lucida Grande Regular».

So I began to design the logo, or more specifically the isotype, which was inspired by a candy wrapped with the aim of giving the brand a sweet vibe and an irregular yellow background that conveys fun, expression and freedom.

Finally, I designed the 4 icons that the website will have, which are the home, the team, the projects and contact. I also used the same color palette but this time only the outline to give more importance to the logo.

Mobile prototype of the web

To continue with the project, I made a mobile prototype with the Marvel tool. As you can see in the video, I created using the photoshop tool, a home screen to access the web, followed by the main home screen. You can continue navigating between the other tabs of team, projects and contact. On the other hand I have created a menu by clicking on the logo where the tabs I just mentioned will appear again, but I have also added a back button and a logout button.

So, with this mock up, we will have a preview of the web page, application or interface under development, before reaching its final stage. This way we will also be able to anticipate errors and maximize the user experience.


Web page design with HTML

Finally, I created the website that is built using HTML, Bootstrap, and CSS. The website is divided into different categories, and within each category, visitors can view the projects that I have created.

One of the most exciting sections of the website is the banner advertisements page. Here, visitors can view the banner advertisements that I have designed using HTML. The page features a range of banners that were created for different products and services.

The website has been designed to be user-friendly and intuitive. The navigation menu is easy to use, and visitors can quickly access the different categories and projects. The website is also fully responsive, ensuring that it looks great on desktops, laptops, tablets, and smartphones.

In conclusion, Nafta’s Sweets is a website that I am proud to have programmed as part of my university coursework. The website showcases my skills in HTML and design, and it features a range of projects that I have created, including banner advertisements in HTML.