Interactive Design / Project 1: Website Redesign Proposal

Interactive Design / Project 1: Website Redesign Proposal

Date: October 9, 2025 | Week 4 – Week 5
Name: Ge Xianjing / 0377636
Module: Interactive Media / Bachelor of Interactive Spatial Design (Hons)
Project 1: Website Redesign Proposal
Lecturer: Shamsul Hamimi Ab. Rahman

Module Information Booklet

---

Detailed Requirements for Project 1

The objective of this project is to develop a comprehensive redesign proposal for an existing website.

Students are expected to demonstrate their ability to critically evaluate a website’s current design and functionality and propose strategic improvements that enhance usability, visual appeal, and overall performance.

---

⭐ Website Redesign Proposal – RK Fine Art

1. Why I Chose RK Fine Art: https://rkfineart.com/

When I first visited the RK Fine Art website, my impression was that it served its basic purpose—it listed exhibitions, artists, and gallery information—but visually, it felt more like a digital noticeboard than a curated art experience.

Everything appeared in a long single-column list. Text-heavy. Small images. Repetitive layouts.

As someone who appreciates how visual storytelling can elevate an art space, I felt that the website did not fully capture the atmosphere or personality of the gallery.
This became the reason I chose RK Fine Art as my Project 1 redesign case.

I wanted to explore this question:
What would the website feel like if it was designed more like a gallery experience rather than an information list?

---

2. What I Discovered During My Evaluation

As I continued browsing the website, several issues became clear:

① Visual hierarchy is unclear

The homepage stacks Singapore, Bangkok, and Elsewhere exhibitions in one long column.
There is no differentiation between what is new, what is ongoing, and what is past.

② Navigation contains too many items

The menu lists more than ten categories (About, Exhibitions, Art Fairs, Artists, Residencies, Publications, etc.).
Instead of being guided, I felt like I had to “search and guess” where each type of information was located.

③ Typography and imagery do not reflect the identity of a gallery

Text is packed tightly and images are small; neither support a calm, curated viewing experience.

④ Browsing artworks is not smooth

Users can only open artworks one by one.
There is no quick preview, no full-screen viewing, and no left/right navigation within an exhibition.

These observations showed me that the website functions, but it doesn’t express.
It informs, but it doesn’t immerse.

---

3. My Redesign Direction

— I want the website to feel like “entering an art space”, not scrolling through a list.

I started by asking myself three key questions:

① What visual style can represent the gallery’s artistic identity?

I collected references from gallery websites, editorial layouts, exhibition booklets, and minimalist design systems.
Most of these references share similar characteristics:

• Large white space

• Magazine-style typography

• Soft, neutral color palettes

• Hero images for major exhibitions

• Strong visual rhythm

This inspired me to move toward a style that is:
➡ “Minimal, curated, and calm — letting the artworks speak first.”

---

② How can information be easier to navigate?

I simplified the navigation into clear primary categories:

• Homage（about）

• Exhibitions

• Artists

• Art Fairs

• Publications

• Gallery Info（contact）

This creates a more intuitive flow and reduces decision fatigue.

---

③ How can artworks become the visual focus?

My decisions include:

• Adding a hero section with a full-width exhibition image

• Replacing text lists with image-based cards

• Enlarging artwork previews

• Allowing horizontal scrolling for exhibitions and artist works

• Designing a full-screen artwork viewer

This shift aims to make the website feel closer to the spatial experience of an art gallery.

---

4. Visual Design Choices

Color Palette

1. Soft Mocha Beige — #D8CFC3

Usage:

• Section backgrounds
• Hero overlay color
• Soft containers and highlight areas
• Creates a warm, welcoming foundation

Role:

Provides a gentle, neutral tone that supports artworks without distraction.

2. Artisan Taupe — #736A60

Usage:

• Navigation bar background
• Headers and structural elements
• Footer background
• High-level UI component

Role:

A sophisticated deep tone bringing stability, elegance, and brand identity.

3. Creamy Mist — #F6F3EF

Usage:

• Main page background
• High-readability content sections
• White-space areas in layout

Role:

Softens the entire interface while maintaining clarity and a gallery-like atmosphere.

4. Muted Rosewood — #B48A84

Usage:

• Buttons
• Hover states
• Active/selected indicators
• Subtle decorative accents

Role:

Adds character and artistic warmth without overpowering the primary visuals.

5. Porcelain Edge — #E8E4DF

Usage:

• Dividers
• Lines and borders
• Minimal UI detailing

Role:

Provides structure and separation while remaining visually light.

6. Obsidian Grey — #4B4641

Usage:

• Body text
• Paragraphs
• Secondary titles
• Descriptive content

Role:

A softer alternative to black, improving readability and offering a refined editorial feel.

---

Typography

• Serif font/ Playfair Display for large titles → creates an editorial, catalogue-like feeling

• Sans-serif font / Jost for body text → improves readability and clarity

This combination balances professionalism with warmth.

---

5. Wireframes – Beginning the Prototype

Before designing the high-fidelity interface, I drew low-fidelity wireframes to focus purely on structure and user flow.

I created wireframes for:

• Homepage (hero, featured exhibitions, quick navigation)

• Exhibitions Page (filters, large cards, city categories)

• Artist Profile (bio, timeline, portfolio grid)

• Contact / Visit (map, hours, gallery photos)

• Artwork Detail Page (full-width image + metadata)

The wireframes helped me understand spacing, hierarchy, and the user journey before adding color or imagery.

6.UX Improvements – Summary

The redesign focuses on:

✔ Simplified navigation

Clean top-level categories and clearer paths.

✔ Better visual hierarchy

Large images, more space, and separated sections.

✔ Art-focused layout

Full-width visuals and improved artwork viewing experience.

✔ Mobile-friendly structure

Larger tap targets, card-based layout, reduced scrolling.

✔ Faster performance

Lazy loading, compressed media, and lighter layouts.

These improvements turn the website from “informational” into experiential.

---

7. Reflection – What I Learned

This project taught me to view web design from a curatorial perspective.

I learned that designing a gallery website means:

• Creating space, not just pages

• Controlling rhythm through layout and scroll

• Using silence and simplicity as visual tools

• Making art the protagonist, not the text

• Designing for clarity, emotion, and exploration at the same time

If I had more time, I would prototype:

• Smooth page transitions

• Hover previews of artworks

• Full mobile micro-interactions

• A dark mode variation

• A more immersive viewing room experience

Overall, this redesign helped me understand how web design can translate the spirit of a physical gallery into an online experience.

Design is not only what we see — it is how the interface makes us feel while exploring.

Following is the redesign proposal: Canva link