Creating Innovation through Education
About this Project
UX Researcher |UI Designer
UX Researcher |UI Designer
Even though this project was a redesign, it involved a number of different roles and responsibilities. These include management (sprint planning, designs, recruitment for usability), UX analysis (flows and competitive analysis), design, low-fi and high-fi prototyping
Bay Area National Science Foundation (NSF) Innovation Corps Redesign
How mobile-first responsive web-design redefines the innovation course application experience
Initially the project scope was a simple website redesign. After reviewing the company website and learning who the target student teams were, it became clear that students in general are heavier mobile users than desktop users and having a seamless experience in a mobile-first design would allow for less confusion and better engagement.
Per conversations with the company stakeholder, a redesign of the website was requested. The current website was busy and difficult to follow. To make it more inclusive, I used a more user-centered experience approach in the application process.
Rather than designing for the web, I took the approach of mobile-first responsive design. I did this because students use mobile more often than the web. Designing for mobile first ensures that screens will adjust to correct size with the given content.
The current Bay Area NSF I-Corps website was clunky and was difficult to follow, as a new user who may be interested in applying to the short course. It was not user-centered, with elements such as the blog, leadership, and testimonials not centered on the goal of attracting potential teams for this program.The basic information of the courses was unclear with the call to action, not clearly defined.The application, itself was in a separate Airtable document with redundant questions that were not relevant to bring the team to apply to the program.
The challenge for this redesign was to bring a clear explanation of the program with a defined call to action. Bringing the other elements of the site and the elements from competitor sites together in a cohesive way so that applicants have a positive user experience without overwhelming them in the process was part of that challenge.
Modified Design Thinking
It is so often that we hear of a problem and we think we know what the solution is. However, without design thinking, and understanding the users and their experience, the results may fall short. The process of design thinking including: Empathize, Define, Ideate, Prototype, and Test are crucial in understanding why certain design solutions may work better than others. Design thinking is an iterative process. In this project, I iterated at every stage. Learning from the participants in usability tests helped me better define what was needed for a better cohesive experience.
There were no true competitors for Bay Area I-Corps. However, other I-Corps and Innovation education sites provided inspiration. These organizations include sites such as Citrus Foundry and the UNY I-Corps. They provided inspiration for the home screen where the testimonial was added, as well other aspects of the application process, such as identification.
The requirements for admission into the short course included: graduate or doctoral student teams (2-4 members) with an interest in bringing a tech idea to market. This team dreams of something big where they can create something amazing in the tech world with their idea.
Usability Test Results
Round 1 usability was conducted using wireframes. In this round, users came to the onboarding screen which had very general information. Users were confused about what to do, especially since the screen had Apply in the bottom bar and in the button.
Other issues were confusion about icons. The envelope for most people means email and my intention was to give a way to ask questions.
Security issues seemed to be an issue, as users were not comfortable uploading ID or giving access to contacts.
Round 2 Usability tests were used using high fidelity screens. In this round, icons were updated, eliminating the second Apply in the bottom bar, removing faculty/administrators, and the envelope was changed to the question mark.
The onboarding screen included more specific information that would entice users to apply, including the amount of the grant, funding, and other support opportunities.
Security issues were dealt with by using Linked In, eliminating the need for uploading the ID. Using a simple contact form, rather than granting access to contacts made users feel more confident in Bay Area I-Corps security.
For one month, Bay Area Innovation Corps contracted with me as a UX Designer and Researcher. Initially, it appeared as though it was just a straight redesign web-only project. However, after much research on the company, the type of users, their service, as well as comparative sites, it was clear that it needed to be mobile first responsive app design.
Using the application process, with the information from testimonials, users were given an experience of moving through the application process using a typeform format, and connection through LinkedIn to make it a more organic process.
One of the areas I learned was the difference between marketing and product. Although in some ways, I am still learning it. Sometimes that line gets blurred but it is an important lesson to learn in product design. As Marty Cagan of the Silicon Valley Product Group explains, “product is about creating great products that users will love and marketing is finding those customers and convincing them to try it.”
Sometimes it is necessary to include a little education prior to the flow (this is the marketing part) but should be the entire flow.
Connecting to LinkedIn, eliminating the access to contacts, eliminated user stress and gave users a better user experience.