Estudioverse | Metaverse Designathon

Discover how we designed EstudioVerse, a metaverse-based study platform aimed at enhancing productivity and connection for students worldwide, created during the Avocademy Designathon in just 7 days.

May 25, 2022
Estudioverse | Metaverse Designathon

Avocademy Designathon Prompt

How might we intentionally create a better world through the metaverse?

Introduction

There is a study group on Discord we joined. When we saw the prompt, we imagined how better of a world it would be if we could all study and meet together in the metaverse.
Project Duration
May 16, 2022 - May 22, 2022
Tools
Figjam, Figma, Spline, Discord, Zoom, After Effects, google forms

Problem

A student who feels disconnected and unmotivated about their productivity and concentration seeks to improve their study habits. They need to complete their school tasks but they face a disconnect in their current study group due to social distancing. Video calls on Zoom and Discord are not enough, they would like to feel like they are in the same study space together regardless of time zones.

Goal

Design a landing page that serves as a gateway to a metaverse platform where students and graduates can collaborate and build meaningful connections
  • Create an immersive experience that simulates studying together with other students in person
  • Keep users motivated through achievement medals and detailed weekly & monthly statistics
  • Make signing up and downloading appealing—since the metaverse is unfamiliar to many, our priority is to help target users feel both comfortable and excited about joining
My Role
As a UI Designer working alongside a UX researcher, I helped create initial problem-discovery surveys. Together, we developed paper wireframes, designed low and high-fidelity prototypes, and refined the designs based on research interview findings.
Responsibilities
Creating User Surveys, a sketch of ideas, Affinity Maps, Competitive analysis, paper wireframes, Design sheets of components, logos, color palettes, and typography. Low & High Fidelity Prototypes, Iterations Design
notion image

Discovery

We started by creating a survey form to understand and empathize with the user's needs, wants, frustrations, and challenges. Students and graduates, many of whish were in study groups, were surveyed. Short-answer responses were categorized into an affinity map to discover patterns in data.
notion image

Competitive analysis

Competitive analysis of the current study group platform and metaverse applications was performed to understand what works and potential shortfalls.
 
💡

Gather

Strengths
  • Users can hold the events including weddings and birthday parties.
  • Mainly focused on video chat for the virtual interaction

Weaknesses
  • information on the website are not straight-forward and hard to understand
  • When I clicked on “Explore” Page, it reach to play the games which was unexpected
 
 
💡

Work Adventure

Strengths
  • Users can set up the rooms and map the entire event by themselves.
  • User can hear and see each other when they meet and are close to each other like meeting in real life by accident.
  • We can see the video of the virtual experiences on the hero page.
  • FAQ & Features are set nicely, we can try use it as well.
  • The pricing structure is clear and straight-forward.
Weaknesses
  • The avatars are small and we sometimes lose ourselves.
  • When we enter the room for joining a conference or meeting. it is going out to Zoom or Google Meet, not a built-in app.
 
💡

Study Stream

Strengths
  • Study Stream focus more on hight school & University students and divides the room acccording to it
  • Also more focused on streaming
  • The track tasks features is very useful
  • Gamification features like ranking of study time gives motivation to the users.
  • Study room are customizable according to Vibe (Sea, Mountain etcs.)
Weaknesses
  • If the user joins the study room is leading to Zoom
  • Not clear if high school user can join to university server room or not.
 
💡

Study Together

Strengths
  • They separated the study room by focus time and music, cam on/off
  • Gamified ranks and progress on status.
  • Rooms where people can hangout during the break or in their free time, Virtual Theater, Gaming Room and so on

Weaknesses
  • New User might get overwhelmed
  • User needs to write their session goals for an hour, afer an hour if the user does not write the sessions goal, user is kicked off. This may be too much pressure for some users, we suppose.
 
 
💡

Discord

Strengths
  • Product is scalable with the upgrade to Nitro ( the ability to enhance your experince)
  • Video Conferencing and scree sharing.
  • Separated chats to designate different conversations preventing chat clogging
  • Moderation tools and special access
  • Reliable technology with low latency
Weaknesses
  • Those that are introvert may not be comfortable with joining video chat rooms
  • Experience is not very interactive
  • You cannot express your personality beyond what you post
  • Features that encourage participation and interactivity are limited
 
💡

Study Stream

Strengths
  • Study Stream focus more on hight school & University students and divides the room acccording to it
  • Also more focused on streaming
  • The track tasks features is very useful
  • Gamification features like ranking of study time gives motivation to the users.
  • Study room are customizable according to Vibe (Sea, Mountain etcs.)
Weaknesses
  • If the user joins the study room is leading to Zoom
  • Not clear if high school user can join to university server room or not.
 
 

Meet Sally our user persona

Before user testing, we created our persona Sally to help guide our decisions during the ideation and design stages. We kept in mind any frustrations or worries she may have like feeling unmotivated or alone in her studying. We were also cognizant of her goals like finishing her master's degree and maintaining focus.
 
notion image
 

Sketches and Paper & Digital Wireframes

Based on Affinity map, competitive analysis and persona, we did the following sketches about the features, the flow of the website, and the pages.
notion image

Iterating Prototype

Final Designs after 1st user interview by my partner, UX researcher, Ms. Valerie Navidad
The website mainly presents the features of a study room in the metaverse, personal space, study room together, and other room that students can enjoy during break-time.
notion image
Click here for the prototype.
Click here for the Figjam file.
 
Style Sheet
Instead of the bright and dark theme, which we are accustomed to seeing as a metaverse or NFTs website, I used mainly Black & white and light blue as an accent color not to distract but to fucus on the main themes, keeping the look clean helping users to feel comfortable with this concept in the metaverse.

Outcomes

Meeting our goals
Because this was a concept we were developing and presenting in Avoacedamy Designathon and not a launched product we decided to measure our success using two factors.
  • Design a landing page as simple as possible to meet the goal of familiarizing users with the metaverse and representing those features as much as possible.
  • Fulfilling the user’s wants and needs within the given timeframe of one week.
We are happy to say we met both of these goals.

Challenges

This was the first time both of us had worked on a project where we had 7 days (168 Hours) to deliver. Like our users in study group, it was important to create an impotant to crate an environment where we communicated effectively and leaned on each other’s strengths. This was essential, especially with a 14-hour time difference.
 
Room for growth: How successful was/wasn’t the product?
  • It was not successful enough to show the virtual design of what the study room looks like, and what the movie rooms look like in a metaverse.
  • Not a formal usability test but we showed the prototypes to some users who answered our survey. They’re keen to know about study group metaverse and show interest in our prototypes and remarked they will use the app if it is created in reality.
 
What we would change looking back?
  • We would do initial user interviews instead of surveys. So that we can further delve into the user experience and empathize with them. I would look for visual cues or clarify any areas of uncertainty.
  • I would do another round of user testing after the 1st iteration if we have more time.
 

Key Takeaways

Sense of community and care
Understanding that users felt alone while completing their studies due to social distancing. We wanted to create a space where they felt safe, encouraged, and excited to complete their goals
Clarity removes obscurity
Communication about what users are expecting is important in promoting onboarding. It leaves space to build excitement.
Don’t ignore key reasons to visit the site
While we want to address business goals, the majority of users will visit for specific reasons that cannot be ignored.
Teamwork
Understanding our roles, communicating, and learning about each other strengths created a great team working environment
 
What have you learned from these experiences?
“I’ve discovered a lot about Metaverse in the fields of business, meeting rooms, social, and education. As far as I searched there are no study groups in the metaverse yet. Through the survey, we learned that some people are struggling with procrastination, demotivation, and longing for companionship due to social distancing during the COVID Period. Though it is great to see each other in the real world, it is also nice we can meet in a virtual world regardless of the time zone, especially in the situation of Covid.” Thet Zarni Win
 
“I’ve learned a lot about the metaverse and what makes a successful study group. Creating an environment where users can feel a sense of community and are encouraged to work together makes a great impact. Once the metaverse becomes more accessible, I think it is going to make an incredible on our world in many ways, especially in design.” Valarie Davidad