Scutwork.com: A Product Redesign Story
Scutwork.com was founded in 1999 to offer insider-reviews of medical residency programs across the country. In 2015 Scutwork was acquired by Student Doctor Network, the largest online medical community of students and doctors with over 16 million page views per month. The acquisition represented a huge opportunity for Scutwork and SDN to expand the resource and making it available to SDN members.
Student Doctor Network engaged Flower Press Creative Studio to handle a product audit and redesign.
The Problem
“Scutwork was founded in 1999 and is immensely popular among students seeking a medical residency. But the system is dated and needs an overhaul. There are un-used features that are old and irrelevant. And, new features are needed to make the site modern and usable.” — Managing Partner, Student Doctor Network
The Solution
The re-designed Scutwork.com is a clean, visually compelling site with updated features and a modern UI.
Process & Research Methods
Website Audit
When Scutwork was acquired, it looked like this:
There were obvious areas for improvement including visual design, information architecture, and conversation to a modern responsive template. However, in order to focus our efforts in the right areas, we started with the data.
Analytics
Scutwork had an existing user-base and analytics. Which features were most useful? Which features were un-used? Where were users getting stuck?
We identified 5 features that were getting little to no use. Further, we identified features that were getting substantial use, and could benefit from improvement.
Heuristic Analysis
To efficiently catalog improvements that could be made to key features we completed a heuristic analysis. This involved reviewing the site and tracking sections that were confusing, misleading or did not provide the necessary information for users to easily interact with the tool. We produced a spreadsheet color coded with critical, serious and minor problems.
Information Architecture
When SDN acquired Scutwork, they brought the service into their single-sign-on (SSO) system. With a single username and password, users are able to access an entire ecosystem of sites and services controlled by SDN. This made it possible to eliminate redundant sections within Scutwork including account settings, contact preferences, user info etc.
In addition, analytics information allowed us to eliminate unused features from the system right away. We were determined to simplify the navigation and data structures on the site to make it easier to locate important information quickly. Further, we had to consider that this desktop-only site was going to migrate to a fully-responsive, mobile-friendly template.
The original logged-in navigation for Scutwork contained:
• Home
• Add A Program
• Modify A Program
• New Programs
• Top Rated Programs
• Newsletter
• Help
• My Favorites
• Editors
• Modify User Info
• Preferences
Based on redundant account features and unused sections we reduced it to include:
• Home
• Add A Program
• Modify A Program
• New Programs
• Top Rated Programs
• My Favorites
And after further refinement:
• Home
• Residency Programs
• Community Favorites
• My Favorites & Programs
We eliminated top rated programs and new programs and presented everything under residency programs. Within the residency programs page, we planned to offer an overview of data related to each program such as practice area, rating, number of reviews etc. The ability to view relevant information within an interactive list view was more intuitive than offering several lists with different breakdowns of the fixed information.
Community favorites houses access to a section previously nested under my favorites in the original tool. Community favorites are essentially other users' lists of favorite residency programs. This simple feature allows students of similar backgrounds and practice areas to browse each other’s lists and find information in a new way. This is similar to the light box feature on stock photo sites.
Finally, menu items to add, modify, review and favorite residency programs were moved under my favorites & programs. This kept each user’s personal “stuff” grouped together in one area of the site.
Wireframing & Prototyping
With our new navigation structure in mind, we started wireframing the desktop and mobile experience. Simplifying access to residency programs was a huge priority. All residency programs were listed on the same page with easy-to-scan data for reviews, ratings, specialty, and location. Instead of listing regions we listed states.
Next, we surfaced filters to allow users to easily view relevant results.
We focused on the program detail pages next. In the original tool, program detail pages contained only the address information on the initial view. The user had to click on the text link to “read reviews” to access reviews for the program. This link was easily missed.
If the user was fortunate enough to locate the read reviews link along the bottom, the page displayed as follows:
There were star ratings, but no easy-to-understand overview information. Also, program contact information became hidden when viewing reviews. The wireframe for program detail page improvements looked as follows:
The page contained all contact information and a summary of overall ratings at the top, reviews were included on the same page, as well as, access to related SDN forums in the particular practice area. Bringing in value-added content from SDN was a good way to connect the Scutwork and SDN services.
Each section presented its own challenges and we went through many rounds of wireframing with internal stakeholders before involving users.
Once wireframes were complete for all major page types, we created a clickable prototype. This allowed us to quickly test our ideas with users and validate our direction. To check out the prototype review the project on Invision.
Usability Testing
We recruited a group of five existing SDN users to perform remote, interview-style usability testing. We asked users to a series of actions and talk aloud as they went:
- Search for a residency program within your specialty
- Browse available programs and find one you’re interested in. Add it to favorites.
- Write a review for a residency program you attended.
Key Takeaways:
- Users found the navigation structure intuitive and easy to use.
- Users were able to complete major tasks without issue.
- Users found the star rating odd when thinking about academic programs. They asked to see number ratings or a badge system instead. Star ratings felt more appropriate for review sites like hotels.com.
- Users found the range slider for number of reviews unnecessary.
- Users asked to see more info-graphic style data for a quick snapshot of school rankings, reviews and overall stats.
With this information in mind we made adjustments to wireframes, and moved on to complete visual design.
Brand Identity & Visual Design
We started by modernizing the logo. SDN wanted to retain the name and iconography but improve the color choice, font selection, and overall presentation. We started here, with royal blue and an upset young doctor:
And ended here, with a modern font, updated color palette, and a happier doctor.
We established a color palette, font style, and icon style.
Next, we moved on to screen design. Final screens appear as follows:
Build & Launch
Scutwork includes custom, responsive HTML/CSS constructed on the Foundation framework. Flower Press Creative Studio provided all UI code and a third-party developer handled back-end development. The site was created in PHP with a MySQL database. We were involved in testing and final QA to ensure the build was completed properly.
Results
“Since launch, Scutwork.com has seen an increase in traffic and residency program reviews. Having Scutwork integrated with our single sign on (SSO) and available with a clean, modern UI has greatly improve the overall user experience. We have high hopes for Scutwork’s growth over time.” — Managing Partner, Student Doctor Network
For more information on the project, visit the project page on our studio site. For additional information on our design process check out our approach page. Please feel free to add feedback in the comments.
Thanks!
Khaiersta Flowers English is Founder and Creative Director of Flower Press Creative Studio, a full-service website design and development studio in Seattle, WA.
