Case Study

Step Up For Studentshomepage and landing page redesign

Background

Step Up For Students is a nonprofit organization that administers various scholarships for Florida students in grades K-12.

In 2021, the income-based scholarship program was expanded, increasing the number of scholarships available and raising the income eligibility limits. Previously, a family of 4 had to make less than $78,600 annually to be eligible. With the new eligibility criteria, this limit was increased to $111,000 annually.

Our primary goal was to drive more traffic to the income-based scholarship page and make it easy to apply. We also needed to change the income-based scholarship messaging to be more inclusive of middle-income families.

My role
Research, Content Audit & Organization, UI & UX Design, Development
Tools Used
XD, Photoshop, WordPress, Elementor, Dreamweaver

Problem

It was difficult for users to determine if their family qualified for the scholarship and what information they needed to start an application. The customer service channels (e.g. call center, online chat, social media) were receiving complaints from frustrated website users, unable to find the information they were looking for. The most frequently asked questions were:

  • How do I find out if my family is eligible?
  • What are the income limits?
  • What information do I need to apply?
BEFOReHomepage
BEFOReINCOME-BASED SCHOLARSHIP PAGE

Users

The users of the website are primarily parents and caregivers of school-age children. Many are grandparents raising their grandchildren as well as single parents. The majority of users are very busy and have limited time to research and apply for the scholarships. Experience levels with web-based technology varies widely across the website audience. Surprisingly, most browsing is done on desktop computers, but mobile traffic is beginning to increase.

User Summary
  • Novice to very experienced with web technology.
  • Facing time-constraints.
  • Browsing on desktop computers.

Ideation

During early content restructuring and wireframing, ease-of-use was top of mind. The website needed to quickly convey the benefits of the scholarships, communicate the different options available, prominently display the eligibility requirements and make it easy to start an application.

Primary Focus
  • Improve content hierarchy, making the pages easy to visually scan and navigate.
  • Place important CTAs above the fold.
  • Highlight the positive impact of the scholarships.
WireframeHomePAGE
WireframeINCOME-BASED SCHOLARSHIP PAGE

Solution

The finished design simplifies the user experience with well-organized content, typographic heirarchy, prominent application CTAs and intuitive navigation. The design provides harmony in style that connects color, type and content visually with the Step Up brand. The addition of stats and testimonials highlight the positive impact of the scholarships. The use of photos and icons add visual interest and appears more inclusive of students in all K-12 grade levels.

AfterHomePAGE
AfterINCOME-BASED SCHOLARSHIP PAGE

Final thoughts

Customer service channels reported a significant reduction in inquiries related to eligibility and application requirements. The application call-to-action buttons performed well, with click rates between 52-76%. As a result, we saw a significant increase in income-based scholarship applications.

What I learned
  1. Interdepartmental communication is key
    While I do have experience working within interdisciplinary creative and marketing teams, this was my first time working closely with multiple departments within a large organization. To gain insights about the audience, statistical data and website requirements, I had to seek out information from various departments. I collaborated with customer service, public affairs, communications, social media, marketing, IT and student learning. I believe this project has allowed me to develop new collaboration skills that will be helpful for other projects in the future.
  2. The importance of understanding your audience
    Compared to previous projects, this project provided a lot more insight and feedback from the current website users. I saw this as an opportunity to strengthen my problem-solving skills and get more involved in the process of learning about the website users and their needs. Some of the methods and situations which I encountered for the first time were eye-opening and will be helpful to use moving forward in my design career.

     

Further enhancements I would like to make
  • Add video testimonials.
  • Use more graphical bullet points to call out alternative eligibility qualifications such as dependents of military members and law enforcement officers.
  • Add an application step-by-step guide that incorporates visuals/illustrations to show users how the process works and what to expect.
  • Implement the redesigned footer and header navigation.