INTERACTIVE DESIGN - PROJECT 2: WEBSITE REDESIGN PROTOTYPE
10/11/25 - 30/11/25 (Week 4 - Week 10)
Lim Jia Xuan 0371026
GCD60904 Interactive Design
Project 2: Website Redesign Prototype
1.0 INSTRUCTIONS
2.0 WEBSITE REDESIGN PROPOSAL
Main Feature of the Prototype
The redesigned website uses black, white, and grey as the primary colours, with a touch of dusty blue to highlight interactive design elements. The dusty blue improves font readability and conveys a sense of calmness and trustworthiness compared to a lighter blue. A sans-serif font, “Inter,” is used with contrasting thicknesses to create a clear visual hierarchy.
For the imagery, some of the original icons were retained in this prototype. However, more professionally taken photos were added because the existing website did not provide many updated visuals. Instead of displaying plain static images, interactive reveal-style image cards were introduced to enhance engagement between Spine Art Chiropractic and potential clients.
The layout follows a 50px grid with 12 columns to ensure visual clarity and structure. Each page includes a full-width banner as the hero section.
The Home page shows Spine Art Chiropractic’s willingness to help clients, followed by sections that outline what clients can expect, their specialisations, and testimonials to build credibility.
The About Us page begins with a friendly introduction and includes a section featuring the chiropractor.
The Services page presents the services offered using playful, interactive card designs that enhance readability and help viewers focus on each service.
The Contact page includes clear contact details, an interactive form, and a map that shows their location.
Design Decisions and Development Process
The prototype was newly designed because the previous proposal was not ideal. This prototype was developed based on the existing website layout because the wireframe itself was not bad—it merely lacked interactive elements for users. Therefore, some layout adjustments were made to create a more engaging and visually appealing user experience.
The first major change involved the landing pages. In the original website, the sections were not separated into individual pages; instead, everything was placed in one long image. I separated each section into different pages and reduced the number of items in the navigation bar.
For the Home page, the upper part uses the icons provided on the website. An interactive element was added afterward.
For the About Us page, the same click-and-reveal interaction was applied for consistency.
For the Services page, I enhanced each service section. Compared to the original website—which only displayed text and icons—I added imagery and hovering effects to help clients better understand what services Spine Art Chiropractic offers.
For the Contact page, the form includes basic appointment information. To make it more interactive, I added a map along with hover and click effects to indicate user actions. Links were also added to all CTA buttons to simulate a more realistic usability test.
Comments
Post a Comment