Interactive Design - Task 1: Digital Business Concept
Cheyenne Liew Khye Yean / 0378330
Interactive Design / Bachelor of Design (Hons) Creative Media
Task 1: Digital Business Concept
TABLE OF CONTENTS
1. Tutorials
2. Instructions
3. Process Work
3. Process Work
4. Feedback
5. Reflection
5. Reflection
1. TUTORIALS
Our first tutorial was to learn some basic coding. We were instructed to download Visual Studio Code and set up the Live View on Google. Then, we were provided with this link: https://www.w3schools.com/html/html_basic.asp for help with the codes.
We mainly learnt how to insert and change colour of text, add images, and hyperlinks.
2. INSTRUCTIONS
Figure 2.1 Module Assignment Briefs
3. PROCESS WORK
For our first class, we were briefed about our first assignment. As the first part of the task, we had to form a group and come up with business ideas to later develop into a website. We wanted the websites to be interactive, as mentioned in the briefing, so my ideas were mainly try-on websites.
My Ideas
1. Digital Clothes Try-on
- A website that allows users to virtually try on clothing via AR technology.
- Includes body shape analysis to suggest flattering clothing options.
2. Glasses Try-on
- A website that allows users to virtually try on glasses via AR technology.
- Includes face shape analysis to suggest suitable glasses frames.
3. Pet Nutrition Meal Plan Maker
- A website to create a meal plan for pets based on information provided (age, breed, weight, etc.).
- Shows what exactly is missing from their current diet and how it helps them stay healthy.
After that, we decided on 4 final ideas which are highlighted in yellow. We had one person doing the competitor website analysis for each, in which I ended up with my own glasses try-on idea.
I started by finding the competitors, where I settled with these 3 websites:
- Focus Point: https://www.focus-point.com.my/
- OWNDAYS: https://www.owndays.com/my/en
- SmartBuyGlasses MY: https://www.smartbuyglasses.com.my/
Then, I proceeded with my analysis which can be seen below.
- Try on, face scan/analysis, and glasses information all in one pop up
- Price and glasses details shown at the side of the try on camera
- Detects face size, shape, and pupillary distance for accurate fitting
- Can use live camera or upload an image
- Ability to compare between options side by side
- Works when turning face for accuracy
- Shows recommendations based on face shape + skin tone + hairstyles
Figure 3.3 Complete Business Proposal, Week 2 (27/4/2026)
Once done with this part, we showed all our parts to our tutor and decided on one final topic to proceed with, which is the POP MART Trading idea. For this, I was tasked to create the slides and make the website layout/moodboard.
For the website layout, I referenced another trading website, Nookazon, and one of the florist websites from the competitor analysis, Bloomthis.
Figure 3.4 Nookazon website, Week 2 (30/4/2026)
Figure 3.5 Bloomthis Website, Week 2 (30/4/2026)
Figure 3.7 Sitemap, Week 2 (30/4/2026)
Figure 3.8 Website Layout - Shop Tab, Week 3 (4/5/2026)
Figure 3.9 Website Layout - Community Tab, Week 3 (4/5/2026)
Website Features:
- Navigation Bar: Shop, Trade, Sell, and Community
- Filter System (Shop Tab): Location, Prices, and Series filters for easy searching
- Condition Rating (Shop Tab): Star ratings based on product condition
- Chats (Community Tab): Messages between sellers and buyers/traders
- Forum (Community Tab): Space for questions, discussions, and etc., each tagged with specific hashtags for filtering purposes
- Trending (Community Tab): Taken based on the popularity of the hashtags used in the forum posts
After our presentation, we were told to make some changes to avoid copyright issues.
Figure 3.10 New Website Banner, Week 3 (5/5/2026)
Final Outcome
Figure 3.11 Final Submission, Week 3 (5/5/2026)
Member Contributions
Chan Xin Yean (Group Leader): Idea contribution, project timeline planning, competitive analysis (florist), sitemapChai Yi Jia: Idea contribution, competitive analysis (pet nutrition), user flow mapCheyenne Liew Khye Yean: Idea contribution, competitive analysis (glasses), presentation slides, website design/moodboardBrianne Tan Kai Ying: Idea contribution, competitive analysis (trading), business idea (main goal, UVP, target audience)
4. FEEDBACK
Week 1
Ideas like art workshop and parking finder are too complicated to make and need a large budget.
Ideas like art workshop and parking finder are too complicated to make and need a large budget.
Week 2
Choose between POP MART Trading or Eyewear for final.
Choose between POP MART Trading or Eyewear for final.
Week 3
Certain parts of the sitemap and user flow chart are redundant. Change the pictures and logo in the website layout to avoid copyright issues.
Certain parts of the sitemap and user flow chart are redundant. Change the pictures and logo in the website layout to avoid copyright issues.
5. REFLECTION
Before this class, I didn’t really have any experience with coding, so the tutorial part was pretty difficult for me. I was also pretty confused about what we were supposed to do in the beginning, but working in a group made things a lot easier since I could ask my friends for help when I needed it. For my part of the group work (website layout design), I actually found it quite fun, even if I needed to look at a lot of references for ideas. Overall, I learned a lot of new things throughout this task and gained a better understanding of coding and web design.
Comments
Post a Comment