INTERACTIVE DESIGN: PROJECT 2_WEBSITES REDESIGN PROTOTYPE

 INTERACTIVE DESIGN: PROJECT 2_WEBSITES REDESIGN PROTOTYPE

21 November 2024

FANG YAOYUE (0372006)

Interactive Design | Bachelor of Design in Creative Media | Taylor's University

Project 2/ Website Redesign Prototype

List

LECTURES

INSTRUCTIONS

FEEDBACK

REFLECTION

LECTURES

Week 9

This week, we will need to develop a prototype for the redesign website. Interaction elements should be included. We will need to do 3 pages, homepage, core content page (at least 1) and contact page.

Here are the requirements for this assignment：

The objective of this assignment is to translate your website redesign proposal into a functional prototype. This prototype should visually and interactively represent the proposed changes, demonstrating your ability to apply design principles and UX strategies effectively.

Building upon your previous assignment (Website Redesign Proposal), you are now required to develop a prototype of the redesigned website. This prototype should reflect the proposed visual design and user experience improvements, providing a tangible representation of the final product.

Prototype Development:

Interactive Prototype:

Develop a clickable prototype that includes key pages and features of the redesigned website. The prototype should allow users to navigate through the site and interact with essential elements.

Tools: Use prototyping tools such as Adobe XD, Figma, Sketch, or any other relevant software to create the prototype.

Key Pages to Include:

Homepage: Present the main design elements, including navigation, hero section, and key content areas.

Core Content Pages: Develop prototypes for at least ONE core page (e.g., About Us, Services, Products) to showcase how the content is organized and presented.

Contact Page: Include a prototype of the contact page, demonstrating how users can interact with forms or other contact methods.

User Experience (UX)

Considerations:

Usability: Ensure the prototype reflects a user-friendly design, with clear navigation, intuitive interfaces, and accessible features.

Interactivity: Implement interactive elements (e.g., buttons, hover states, form fields) to provide a realistic user experience.

Submission: 

A fully functional prototype ACCESSIBLE via a SHAREABLE link or as a DOWNLOADABLE file.

A brief writeup in your E-Portfolio of (500–800 words) outlining the key features of the prototype, any design decisions made during development, and how the prototype addresses the objectives set in the redesign proposal.

Reference page

Reference Home page

Referring to the Nike web page in the previous assignment, what I want to do is a sports-related website, the website must contain discussion groups and places to watch the game, the most important thing is the method of contacting the website, I will leave my contact information on the website, or give me a message, I will do a web page alone.

Visual Reference：

I chose Tencent Sports, a very famous sports website in China. If you want to watch basketball or football or even esports in China, you need to check this website. This website can be said to monopolize the market in China, taking all the rights to broadcast sports events.

I have loved basketball since I was a child, so I want to imitate Tencent Sports and make a software that only belongs to basketball fans to watch games, discuss and share, on which you can watch games, you can score players' performance, you can predict the championship, you can talk trash with other fans, I think it is a very cool thing.

INSTRUCTIONS

Website Brief description：

This time I just want to make a sports-related web page, based on the nike brand sports website in the last proposal, and the Tencent sports website this time, I will combine the two to produce the basketball theme website.

I have been an avid NBA fan since childhood, so I have made a lot of friends because of NBA, and I also like basketball friends. While watching basketball, I learn their culture and feel the happiness brought by basketball, which is rare in daily life. In this summer, I also met the famous star Paul George, and gave me his autograph and took a photo with him, which inspired me even more. I think basketball gives me not only physical exercise, but also mental exercise.I'm not just exercising physically, I'm exercising mentally.

Next, I would like to introduce the software, which is divided into six parts: Home page, team discussion, venues, news, about NBA and Contact Us. I have made a total of seven pages, in this page you can immediately inquire about NBA basketball-related information, such as the score of the last two teams, the total number of wins and losses in the season, or see which star injury or star transfer news, you can also receive today's game which rookie player played their own value.

You can also see the information of each team's arena, so that you can go to the arena to see a scene opposite the NBA game, the news does not have to say, the big things in the NBA in recent days or in recent years will be broadcast in class, even if the retired veteran for many years, such as Yao Ming, such as O 'Neill's recent updates will also be published on the above, you can easily understand the consultation through this website, This is a very comprehensive sports basketball website.

I think the most interesting part is this part, the team discussion is a very interesting part, while watching the football in China, you can score the players on the software Hupu, only for the performance of the game, I think you can also on this website, you can evaluate the history of the player, score the performance of the player, and publish. Let more people see, you can also support your favorite team with your fans and friends in the discussion group, but also in the discussion group and the other team's fans spray trash, this is an interesting point, but also the basketball culture, the fun of basketball, after the game all contradictions disappear. Both players and fans can shake hands and make peace, the last about us I think is necessary, you can enter your name and contact information to contact me, there is also a contact number, through this to tell me what needs to be improved, so as to make this website more perfect, more interesting, for the basketball we love.I enjoyed the process, the experience was good and the result was perfect.（520 words in total）

Overall layout

layout  homepage

layout NBA team Discussion

layout NBA venues

layout NBA News

layout With regard to NBA

layout Contact us

Figma link: https://www.figma.com/design/8pUCfGUhhfWSxQs8D9fL6p/Untitled?t=B6Z9Xc9xy8HcigNk-0

Website link: https://fangyaoyue666.netlify.app/

FEEDBACK

Week 10

I have always wanted to do a sports-related website, but I am not sure what to do. I want to do basketball, but it must be very complicated and need to do several web pages.

Week 11

I think although it is difficult, but I can challenge, the challenge of how to do well, I found a lot of materials, referring to the major sports websites, I feel that there is something missing, I want to combine their advantages with each other, and then add their own ideas, to become an excellent sports website.

REFLECTION

It is not easy to make a web page well, but through this assignment, I feel that my DW is getting better and better. I put a lot of effort into this assignment, but I think my figma is not good. In many cases, I like to leave the wrong places empty first and modify them at the end. This homework I finally made my favorite sports website, thank the teacher very much for the help in class, he gave me a lot of encouragement.