Inspiration
The Motivation behind this project was to make such a website using HTML and CSS which shows the basic functionality of a selling website as those available all over the internet. Drawing inspiration from modern luxury brand websites, we aimed to design a digital space that effectively communicates elegance, sophistication, and quality.
What it does
The site showcases the brand's luxury suite of fragrances and offers a rich user experience. This also includes aesthetics such as an amzing layout, organized content, and interactive elements aimed at increasing user experience and identifying with your brand.
How we built it
The design of the website and its layout is chosen to produce a visually appealing and effective impact on the users. This project involved creating a full website for SMAR’s, a fictional perfume brand developed using HTML and CSS The following things were kept in mind while designing the website to make it beautiful and attractive. Background Color Scheme: We decided to go with warm, earthy tones like browns and beiges to create an essence of luxury and natural beauty. These colors are consistent with the luxury position of its portfolio and the eternal nature of elevated fragrances. Design: The design has a centrally aligned logo, intuitive navigation, and product displays arranged in a grid format for clarity and ease. In its homepage, a big, high-resolution banner image is used to get a attention of the visitor right at the first moment.The products are displayed in an aligned form in the catalogue page to create a pleasing and appealing format. The sign in page and the cart are also designed in such a way to make it easy for the user to use whereas the about page tells all about the brand and team in a interactive and informative way. Typography: We used sophisticated serif fonts for headings to show elegance, whereas body text was in legible sans-serif fonts so people could easily read and understand it.The font sizes and weights are also well thought about to make it easy for the user to read and a warm brownish color scheme has been used to make the website appear as elegant as possible. Interactivity: Subtle hover effects on navigation links and product images have been used to give the website a dynamic feel, promoting user engagement without detracting from the design.
Challenges we ran into
The designing process of SMAR’s website was thoughtful and creative filled with efforts and emotions. It was not an easy process because we sometimes face an error that I was not able to catch and fix but I tried hard to find the error and make this website beautiful and eyepleasing
Accomplishments that we're proud of
Through this project the major findings that I did are: • The importance of a visually appealing designs • Many new tags in HTML like a figcaption tag where you can add captions to a figure, similarly I discovered many new functions in CSS as well. • The impact of well-chosen color schemes and layout on the website design • The importance of a smooth navigation from one page of the website to other
What we learned
Building the SMAR’s brand website provided me with a great learning opportunity to use my knowledge about HTML and CSS languages to develop a functional and interactive website for perfumes. It led me to learn more about the best way to present a brand, responsive design, and how to incorporate a user-centered approach to design.
What's next for SMAR's Fragnances Website
Next I would like to make the website more interactive by using javascript and integrate database at its backend so that this website is completely ready to get launched
Log in or sign up for Devpost to join the conversation.