Topcoder Getting Started Journey - Concept Ideation Challenge

A first-time member suffers from information overload. It’s not clear what the Topcoder benefits are or how long it would take to earn the first paycheck. We need a ‘getting started’ journey that guides the user in her first arrival to the website, to educate her in a seamless, effective, and engaging manner.

Challenge Objectives

• Conceive a user journey or pages flow that demonstrates the success path of educating a new member.
• Focus on first-time members.

Project Overview

• We are striving to onboard new members friendly and effectively. As a part of this endeavor, we are designing a getting-started flow that demonstrates what the user can get out of Topcoder.
• The new member spends too much time trying to understand how to compete, how to learn, how to make money, how Topcoder works, and when to expect the first payment.
• The goal of the project is to reduce the friction in the education phase of a first-time member. To show the journey from start at Topcoder to earning at Topcoder.
• We consider success, in this journey, the indication of a new member learning how to make a living out of Topcoder.
• We expect the outcome of your efforts to enlighten us on how to approach new members. In other words, you must tell us what journey works better for a new member and justify your proposal through a visual design of the journey (either high or low fidelity).

Audience 

• Working professionals with the potential to become part or full-time Topcoder competitors or gig workers.
• Focus on new members' needs and interests.
• Users will find this page through marketing campaigns.
• Anyone from the community worldwide would be able to use this page. 

Persona

• Name: Sophie Amundsen.
• Age: 38 years old.
• Occupation: Bank Finance Analyst.
• Frustrations:
  • Freelance websites offer too much information, irrelevant to her immediate needs.
  • Lack of clarity on how to make money.
  • Can’t find how long it takes to receive a payment or to consolidate a steady career in Topcoder.
• Likes:
  • An engaging interface.
  • Visual and vivid explanation of how Topcoder can satisfy her specific needs.

User Story
Sophie is an expert in finance forecasting with a keen interest in taking the leap-of-faith to learn about machine learning to broaden her array of opportunities for working remotely. She has been working in a 9 to 5 job for over 15 years, she is looking for a lifestyle change to spend more time with her two toddlers at home and intimately working on her family prosperity as she has observed the benefits of remote work after the highly supporting evidence that COVID-19 pressured to pursue.

There are several options out there for her to try but Sophie has no time to waste during this discovery process, she has to pay bills, she is eager to land on a place that teaches her what she needs to start cashing out as soon as possible, as steady as possible for her to support her new lifestyle vision.

Sophie found out about Topcoder through a Google search. She lands on a welcome page. If Sophie feels confused after spending 5 seconds on the page, she considers the platform a failure. If Sophie is engaged to learn how to make a living out of Topcoder, she feels happy (success). In order to achieve that, Sophie is taken through a thought out experience that shows her the journey from start at Topcoder to earning at Topcoder (ultimate goal).

Requirements
Overall

• The requirements below work as a starting point for your creative journey of exploring which options could possibly serve better to the new members’ needs and frustrations. You are encouraged to offer your unique approach.
• The expected flow is open for suggestions, but as a minimum, it should satisfy the following conditions:
  • User lands on a target media - is it a landing page? Is it a video? Is it a game? - tell us!
  • User understands the opportunities available for her to earn money, to be part of Topcoder - what adds value to a new member? - tell us!
  • User learns the journey/path she needs to embrace to collect her first paycheck.

Getting Started Journey

• The target media, content, and flow are open for suggestions. We strongly encourage you to browse these pages to find inspiration for the content that you find suitable for this new member experience.
• Put yourself in the shoes of various types of members that come to Topcoder, they may be from different backgrounds and experience, and might be here for:
  • Learning Programming from scratch.
  • Earning money from Challenges.
  • Earning money from Gigs.
  • Up-Skilling themselves through Skill Builders.
  • Being a part of Topcoder’s famous family-like community.
• Think of Topcoder’s Value Proposition as a member - how it helps members from various walks of life:
  • They can learn and do what they love.
  • Enjoy the perks of remote work: work anytime, work from home, work while traveling.
  • Growth opportunities for a freelancer as a project manager and expert reviewer.
  • Working on high exposure projects with renamed clients such as NASA, Harvard, T-Mobile, GE, ESPN, and so forth.
  • Opportunities to earn paid travels to the US (Topcoder Open).
  • Opportunities to land a dream job in tech companies like Facebook, Google, Microsoft.
  • Finding belongingness in a community with like-minded persons.
• To prioritize content, reflect on these questions:
  • What is that thing/info you wish the website had introduced to you earlier or clearer that could have been game-changing for your satisfaction and performance?
  • What are those elements that are not relevant? What information are we providing that is overwhelming for a new person interested in making a living out of Topcoder?
• A tool that can help you gain this in-depth understanding of the new member's actions can be facilitated through a customer journey.
• The content of this page must be engaging, on some level, entertaining the user as she is being educated. Here are a few approaches for your consideration, but this is totally open to creativity. It is your job to show us what will solve the new member pains and frustrations:
  • Visual journey: what is her getting started as a Topcoder member map or guide? a visual journey to help her get her first paycheck from Topcoder. Think of an infographic-like experience that could be integrated into the page. The infographic can be integrated into the landing page, a way to display the easy seamless stupid steps for the member to get a paycheck/prize.
  • Virtual tour: navigate the user through the UI explaining where to find challenges, how to submit, etc.
  • Challenge simulation: to demonstrate how a challenge works, present the user a sort of UI that allows her to see mockup challenges, click “submit” in case of challenge or “apply for a gig” otherwise, then a micro-animation with the paycheck. The fundamental goal would be to show her - through actions that she performs - how to receive that payment.
  • Interactive navigation: on the same line of simulation, the user could navigate a UI from point A (start, challenges list) to Z (collect paycheck). Where B, C, D, etc, would be the necessary steps, register to the challenge, submit, etc. It can be done in the form of video or slide-by-slide as seen in this example.
• We need you to be thorough, think deeply, research, reflect on what is relevant to a first-time user. The concept, ideas, and flow are dramatically more important than aesthetics.

Deliverables
We expect to receive a journey proposal. It must contain the following information:

• Target media: specify what’s the media? Is it a web page? A game? A video?
• Fundamental content: write down the content that you consider quintessential for the user.
• Flow: describe the set of steps and actions available for the user, from acknowledging the journey to learning how to make a living out of Topcoder. How does the user find this page/video/infographic? What are the options to navigate? How does it end?
• Visual: use a visual output to showcase the content and flow of your proposal.
• If the proposal involves a web page, Topcoder branded visual design: desktop at 1440px width.
• If the proposal involves something else (e.g. video, animation, diagrams, etc), provide a walkable presentation (slides, marvelapp screens, etc).

See example. It’s out of context but it works as a reference frame of what we expect as a deliverable from you.

Design Goals & Principles

• Personalization. Focus on the first-time member journey experience. 
• Seamless user goal discoverability. Drive the attention on the user goal while showcasing a frictionless path to success for the new member.
• Comfort. The experience should feel easy to navigate, with zero fear of action. How to make it engageable?
• Learnability. What the user will learn from this experience and what the main benefit is must be accessible without hindrances, almost intuitively.

Branding Guidelines
You can use Topcoder brand guidelines or the GUI KIT cheat sheet, but it is not mandatory to present a high-fidelity design at this stage.

Judgment Criteria

• Creativity: Impactful; the solution is different or unique from what is already out there and can be implemented.
• Exploration: Out of the box, consider the screen requirements and guidelines as a draft or start point. Provide alternate experiences or workflows to achieve what we are proposing in the requirements and satisfy the user goals.
• Aesthetics: Low-fidelity design; provide plain simple aesthetics such as wireframes, black & white outlines, .

Final Deliverables

• All original source files.
• Files can be created in text processors, slides, animation tools, Adobe Photoshop, Adobe XD, Sketch or Figma. TXT files, PDF, Slides, JPG/PNG Screens.
• If you need a Marvel Prototype to show a visual design:
  • Request a MarvelApp prototype from me using this link: https://tc-marvel-app.herokuapp.com/challenge/30170480 
  • Do not use the forums to request for MarvelApp.
  •  Provide clickable spots (hotzones) to link your screens and showcase the flow of the solution.
  • You MUST include your Marvel app URL as a text file in your final submission labeled “MarvelApp URL” (in your marvel app prototype, click on share and then copy the link).