Creating Innovation through Education

February 2021

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 Challenge

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. 

Screen Shot 2021-03-09 at 11.51.41
Competitor/Comparative Analysis

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.

Target/Customer  Persona

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.

Screen Shot 2021-03-10 at 1.42.49 PM.png


Sketches were used as an ideation exercise to inform the potential flow and design. Originally, the stakeholder was requesting a website redesign. There was no FAQ in the original but in some competitors, they used a FAQ, as well as a timeline, method, testimonial. There was some confusion as to where to put the Apply button.

Screen Shot 2021-03-10 at 3.42.09 PM.png

This sketch is the about screen with the what, how, and why

Screen Shot 2021-03-10 at 3.41.51 PM.png
Round 1

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.

part 1.png
invite members.png
  • There was confusion as to why a user would want to apply with onboarding, as there was not enough information about  Bay Area I-Corps.

  • Users indicated only one apply button was needed

  • Envelope icon for contact was confusing for some users

  • originally there was a faculty page (with the other icon) but felt it did not add to the user experience so was removed

  • Users were asked to upload their student ID's. Again this was problematic, where creation needed to be with each individual. From a security standpoint, many users are uncomfortable with uploading their ID's.

  • In the original wireframes, each member of the team would need to have a login creation. This was problematic from a user experience standpoint. 

  • In the original wireframes, users were asked to give access to their contact information, which most were uncomfortable with.

  • They were asked to use radial buttons to choose contacts to invite.

    • By eliminating this form of invitation, users had a smaller number of screens to go through​

Round 2

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.

iPhone X Mockup label.png
part 1.png
Mobile-Contact- q.png
Screen Shot 2021-02-16 at 2.20 1.png
invite members2.png

In these mid-fi screens, it was improved by:

  • Image for the testimonial

  • Highlighted text in the testimonial

  • Main points why users would be entice to apply

  • Short education on the program

  • One- clear apply button

  • Improvement with colors, one email, icon

  • New screen for contact for questions

  • This screen shows the recording of the video

  • Rather than having to upload ID, LinkedIn was a more acceptable way to give access, as well as for invitations.

  • Contact form was added to replace access to contacts. Icons were also modified, eliminating faculty and changing the envelope to the question mark.


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.

Lessons Learned

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.

Iphone 11 Screen_AC.png
Telehealth Delphi Project
ipad pro 12.9 inch.png
iPhone X Flying Mockup.png

Deeply App

Deeply Mockup.png