W13- Website Interface Development

WEEK 13

PRACTICAL

The week of developing the demo website in WIX. For the background colour of the website are using all white to stand out the informations and the images. Below are the desktop version for the client website.

DESKTOP VERSION

The main page / home page are showing the banner at first, we helped the client to make a new banner since they didn't have a actual banner for their own and also for website. According to the recent special day, we put the theme Mother's Day for the banner and under the banner will showcasing the best selling flowers of the brand. Moroever, it will let the users to click to choose their flowers by clicking the send flowers. For the About page will be showcasing and telling their history, brand mission and also core value of them.

For the product page wll be showing all of their products inside. By clicking the categories at the panel beside, the users can choose the categories that they wanted to buy. Also, the price tag filter can also be clicked to filter the price range that the users or consumers want. 


The contact page is very simple, by clicking the text or the icons of the social media, it will direct to the third party platform such as Facebook. Instagram, Whatsapp and also Email. The simple layout can let the users immediately see the important informations. 

For all of the products, when clicked inside, it will shows the product information, price and also quantity options as well as add to cart functon. Above will be showing the other flowers that the users might like such as like a suggestions. 

MOBILE VERSION







The mobile version we are trying to remain the same style and the same layout like similar with the desktop version in order to ensure the consistency and the overall visual and navigation will not look so messy. The mobile version is all using single layout to make the images and all the information stand out in a small screen size (Mobile phone size). 

LECTURE

The week of the lecture was talking about website evaluation and maintenance. The process of determining a website's usability, accessibility, and efficacy in achieving its objectives is called website evaluation. It entails assessing the functioning, content, navigation, and design of the website to pinpoint areas in need of development.




In order to improve user experience, performance, and conversions, website evaluations evaluate usability, accessibility, design, navigation, content, and functionality. Updating security software, creating new content, and keeping an eye on the site's performance to make sure it runs smoothly are all examples of website maintenance activities that can have an impact on sales, SEO, security, and first impressions. 

Maintenance duties are divided into four categories: weekly (such as using Google Analytics to measure traffic), monthly (like updating plugins), quarterly (like reviewing SEO), and annual (like renewing domain and hosting services). A website's ability to perform, look good, and be user-friendly depends on regular maintenance, which also helps with SEO and user retention. 





The lecture note highlights resources for additional reading on assessment checklists and maintenance techniques and highlights the use of an adaptable website builder to simplify maintenance work.



Comments

Post a Comment

Popular posts from this blog

A1- Summary

Image
 A1 SUMMARY:   This task has taught me about the design process as a whole. The techniques for designing the logo, website banner, and CV. Furthermore, I discovered how useful logo design standards are; when I utilise architecture and professional rules, the results are more exact and excellent.  During the process of creating the website banner. I learned about the importance of images; they define the overall atmosphere of the website and must be properly chosen. Furthermore, I experimented with several layouts and images to achieve the desired style (as demonstrated in the weekly notebook below). The more I investigated, the more possibilities I had for the final and learned from them. The knowledge I learned for my CV is simple and formal. It doesn't have to be elaborate; it's just simple information to let the company know about me; it should be catchy but not overly fancy. As a result, I discovered that using an icon is an effective method to highlight the mos...
Read more

W1-Website design fundamentals

Image
WEEK 1 PRACTICAL During the first week practical, the lecturer was assigning us for the assignments that the students need to complete in the 14 weeks of the semester. Firstly, the students need to create a Pinterest board to shows the inspiration of the students from there for the assignments and create a blog page for the weekly journal for explaining the ideas that we get inspired by.  The images below are the styles that I get inspired by. Which they are all using a very interesting ways to create a creative designs by playing with contrast of the size of font, the font they are using are modern which is mostly Sans Serif and the simple but large subject matters (images) that can deliver the message directly and strong with the visuals.   I like the design of the UI and UX of them. Which they will move or the subject matter will slowly transforming  according to our movement of the cursor  and yet the designs are clean and simple by using a plain background ...
Read more

W2- Logo Development

Image
WEEK 2 PRACTICAL During the second week of the practical session, the lecturer brief about the part 1 of the assignment 1 which is related to create a logo. The first thing that the students need to do is to find references for the logo. To know that what they want to do and what visual message that they want to deliver to the viewers.  LOGO & LOGOTYPES The differences between logo and logotypes is that logo representing the simplified icons, visuals and symbol. While the logotypes is about text. It's about the full name of the logo, a kind of description that describe the logo. Everything that relates to "types" that means typography in design. Lecturer used McDonald's as the example, the alphabets "M" is the simplified of the McDonald's. The first 10 years of McDonald's, they are not using just only alphabet "M" in their logo. They constantly renewing and evolving their logo. Therefore, I have found a few references as shown below:  R...
Read more