hello, users!
Interactive educational platform to make UXUI learning fun and engaging
problem definition
BACKGROUND
Don Norman first termed "user experience" in the early 1990s, and numerous UX theories and methodologies have been developed afterwards, such as Jakob Nielsen's 10 usability heuristics and Peter Moreville's usability honeycomb.
User experience encompasses all aspects of the end-users interaction with the product, making it a crucial and promising field of study. Proving this point, the number of UX professionals is forecasted to steadily rise as well. However, its approachability is an issue as many find it difficult to understand the concept of UXUI design, so did my own relatives when I tried to explain what I study at college.
so what really is UXUI?
desk & user research
COMPARATIVE ANALYSIS
In order to understand the strengths, weaknesses, and unique points of existing UXUI platforms, the 6 most popular UXUI mobile applications were tested and compared. It was possible to categorize the services based on their main function as the following, and the most representative application from each category was analyzed in detail:
UXUI terminology glossary
UXUI courses
Intuitive display of UXUI elements
Most UXUI education-related websites were blogs or course providers except UX Myths. As the early stage of the project focused on correcting some popular UX misconceptions and the misunderstanding about its approachability, this website was also include in the comparative analysis.
USER RESEARCH
To define the target users and user needs, research was first conducted on UX designers. I asked what are the most common UX myths that UX designers encounter by writing a post on UXDesign Reddit community. The post received more than 30 upvotes and 40 comments, and the key insights are as the following:
UX designers' needs
Biggest myth is UX is not UI
Difficulty explaining UX design and its difference from other design jobs
Problems in collaborations when others don't appreciate UX design
In order to solve the problems UX designers are facing, the target users of this service were defined as collaborators of UX designers who need introductory knowledge in UX. UX designers are secondary users.
reddit responses
3 user interviews
USER INTERVIEW
3 primary user interviews were conducted to hear their specific needs. The interviewees were either interested in UXUI design and/ or related to the field as a collaborator:
Professional graphic designer
Undergraduate student studying marketing & branding who has majored in Communication Arts & Design
Undergraduate student working as freelance programmer
Users' needs
Confused between UX and UI
Want friendly & familiar language
Wish to learn basic terms & concepts
UX vs UI
Biggest UX myth & confusion
collaborators
Target users who need introductory UX knowledge
approach
Easy & friendly approach is needed
To provide a fun and interactive web platform to users who are interested in or need an introductory knowledge of UXUI as a collaborator of a UXUI designer such as developers
development
EXPLORATION
Many interactive websites were referenced to and ideas from the community post and user interviews were explored.
characterization
game analogies
IDEATION & DEVELOPMENT
Finalized idea and key features include:
Characterization of UX and UI to show their difference
Storytelling of UXUI analogies to introduce concepts and difference
Interactions with UXUI games for engaging education
Website and character moodboard, along with initial character design are as the following:
WIREFRAME & STRUCTURE
Website structure and organization, together with wireframe were created. While developing the initial wireframe, the character design was changed to appeal its friendliness.
prototyping & testing
PROTOTYPE
Initial prototype was created with Figma.
USABILITY TEST & FOLLOW-UP INTERVIEWS
9 participants conducted the UT and follow-up semi-structured interviews to collect direct and crucial feedback on the prototype. There is a variety of UT users, from a developer to businessmen. Key insights are as the following:
clarifications
Many users pointed out confusions in animation, storyline, concept explanation, etc.
more interaction
Participants expected games to be more interactive
working game
UNITY
I wasn't skilled in HTML or Unity as I just started learning about them during the semester. I tried inserting all necessary images into HTML and making them appear and disappear with a click cue, mimicking how buttons actually work. However, Unity had more features such as animation and was easier to quickly adapt to. Thus, Unity was chosen and used for creating a working game.
hello, users!
further development
EXHIBITION & ADVANCEMENT
This project will be displayed as a part of the senior exhibition. The exhibition plan is to emphasize the unique point of the project, specifically characterization, by installing goods related to the UXUI characters. Meanwhile, further advancement of the service includes adding advanced game features, creating an input data field to collect and reflect user data, and includes inserting the game into the website through WebGL for higher accessibility.