Interactive Design: Exercises
Interactive Design
22.04.2025 Week 1
Shiqing Li / 0366582 / Bachelor of Design (Honors) in Creative Media
Task 1 Exercises / Taylor's University
MIB
Instructions
The objective of this assignment is to develop a
comprehensive proposal for the redesign of an existing website. The
proposal should demonstrate your ability to critically evaluate a website' s design and functionality, and to propose design solutions
that enhance user experience, aesthetics, and performance.
Exercise 1 : Web Analysis
(Week 1-2)
Choose FIVE (5) websites from the link given. Review the website that you've selected carefully, taking note of its design, layout, content, and functionality. Identify the strengths and weaknesses of the website, and consider how they impact the user experience. Write a brief report summarising your findings and recommendations.
"Kultriveret" is a website aims for wealthy customers who are interested in their culture and wants a unique travel experience rather than normal ones. This can be seen from the style and the tone of the website. The design is rather elegant and clean, looking at that, we can see that the customers they are aiming for wealthy people. It talks about a travel company in Copenhagen, the main characteristics of this company will be exclusive cultural experience.
The use of colour for this website is minimalist and calm, the colour palette of the website is soft, the use of the natural colour makes the design looked peaceful and allows the audiences to feel safe. The typography is simple and straight-forward, make the website easier to read and understand. The images are characterised into mainly three types : Nature, Culture and lifestyle. The way of design is similar to luxious brands and magazines, which attract the target audience.
The navigation is very unique and has it's own style, but this might be confused to the first-time users. The design of the website has not much traditional elements. The affluentcy of the animation and the texture of the website creates splendor effects, but if the user is using weaker devices, the result might not reach the expectation. After all been said, this website is more for the look than the efficiency of the website.
The content of the content is well-written and fluent in language, it's very clear and formal to read, nothing is off topic and it comes straight up to the point, but overall it fits the luxurious effect. The loading time of the website is rather slow compare to the simple ones, since it contains many animations and images. It can fit perfectly on different devices, and it works well on modern browsers, but might not be fluently on the older ones.
Basement Studio is a creative agency website aims to attract modern customers who has their own styles. They are looking for clients who are looking for unique and special design work. We can see this from the cool and modern design of the website. It uses strong animations, dark colors, and unique visuals, shows it's made for people who like new, high-end digital design.
The colors are mostly dark with bright highlights, giving a sharp and modern feel. The text is big and bold, and often appear in capital letters, adding a feel of confident and strength to the website. As for the images, the website uses moving graphics and 3D visuals to show its design skills and style. The website looks like something made from a fashion brand or technology company, which they are very good at catchy design to grab client's attention.
The navigation is very different and artistic, but it might be confused to use for first users. The animations and effects look great, but they can make the site to run slower on older or weaker devices. The main goal of this web is to impress visitors with design, but not very straight-forward on the information.
The content is short and clear, and fits the design. The website explains what the studio does and shows many examples of their work, everything is easy to be found. Because of all the visuals and animations, the website takes a bit longer to load. It works well on most phones, tablets, and computers, but might not run smoothly on older browsers.
Truekind Skincare is a website made for a skincare brand focusing on clean, natural, and gentle beauty products. The target audience of this website are people who care and truly worry about healthy skin and want trustful, simple products. We can see this from the soft and calm design, the clean and straight-forward layout, and the way the brand talks about kindness and care.
The color palette is soft and natural, it contains a lot of whites, beiges, and soft tones colours, all this gives the website a fresh and clean feeling. The typography design are simple and modern, giving a professional look, it makes the information easy to read. The images is mainly about healthy skin, soft textures, and nature scenes, which again highlights the theme of natural of the product, it helps to build trust between the audience and show what the brand is about.
The navigation is easy to use, it contains a menu at the top in order to prevent the reader to feel lost. It's simple so users can quickly find products, about pages, or contact info. The interactive elements like scrolling effects and product highlights fits into the theme very well and it does not slow down the site, letting the design to be just fine.
The content of the information is short, friendly, and easy to understand. It mainly focuses on the brand's values, kindness, care, and natural ingredients. It gives out the information without using too much complicated words. Everything is well-organized in order, so even first-time users can learn about their products and brand very quickly.
In terms of performance of the website, the website loads fast, and it works well on both computers and mobile phones. It can fit perfectly on different devices, and it works well on modern browsers.
Charles Leclerc's website is designed to show his professional racing career(The sporty cover of the website) and his personal life. The aim is to attract fans, followers or admirers who are interested in learning more about him as a Formula 1 driver and as an individual. Overall, this website is showing the excitement of car racing and a personal glimpse into his world.
The color scheme of the website uses reds and blues, creating a comparism, it is energetic and match with his Ferrari team colors. The typography is modern, clear, and straight-forward, making the information easy to read. The images and animations are dynamic, showing race footage and personal photos that try to engage the visitors and creates a sense of speed and personality.
The navigation is interactive and interesting, sections like "The Driver" and "The Man" guide the reader of the website through different sides of his life. Since the design is visually attractive, some users might think the navigation is not so straight-forward due to the creative layout of the website.
The content is informative, includes the insight of his career achievements and personal interests. The information is well-organized, so users can easily find information about him, such as racing stats, biography, and media appearances.
In terms of performance, and it works well on both computers and mobile phones. It can fit perfectly on different devices, and it works well on modern browsers.
"OH Architecture" is a website that targets clients who are looking for high-end, elegant, and modern home designs. The website is made for clients who want stylish and carefully planned spaces, most likely people who have the budget for custom-designed houses. This can be seen from the clean and calm design. The tone of the website feels professional and classy, showing that it's made for people with good taste and possibly higher budgets on home design products. The tone of the website feels professional and thoughtful, which fits the image of a studio that offers high-end design work.
The colour use on this website is minimalist and soft. It mostly uses whites and greys, which create a peaceful and calm feeling. These colours make the website feel chill and high-class. The typography is modern, thin, and easy to read, which matches the clean style of the site.The images are mostly of buildings, spaces, and homes, focus on details, lighting, and structure. The images are large, full-screen shots. The whole design feels like a modern art book, which matches what their clients are likely looking for.
The navigation has its own style. However, it fits the creative and modern tone of the website. It has a hidden menu that slides out, which might confuse new users at first. The smooth animations and transitions add to the overall experience, but if someone is using an older or slower device, the animations might not run perfectly. The website is clearly made to look beautiful and impress viewers, rather than focus only on quick access to information.
The content is short, clear, and very focused. It doesn' t include extra or random information. It gives basic information about the studio, such as their projects, and how to contact them. Everything on the website matches the tone of luxury and design. The writing is professional and easy to follow. The website loads fairly quickly for its design, and it works well on phones, tablets, and computers. It is best used on modern browsers, and may not work as smoothly on older ones.
Exercise 2 : Replicate websites
(Week 2-3)
Your task is to replicate an existing website to gain a better understanding of its structure. This exercise will help you develop your design skills using software such as Photoshop, Adobe Illustrator or Figma, and gain insights into web design best practices. Full brief will be upload in Google Classroom.
Comments
Post a Comment