Evolving InstaGrade

In 2014, I decided to redesign my iOS app, InstaGrade – an app for teachers to grade multiple-choice tests with an iPhone camera. I'd originally built the app in 2012, visually refreshed it and fixed bugs – but in 2014, armed with more than a year of user feedback, I decided to completely redesign it.

InstaGrade, pre-redesign

InstaGrade in 2013 – I visually revamped the app for the iOS 7 launch, but the overall layout and user experience stayed the same.

InstaGrade v1 was a standalone app – there were two answer sheets (a 24 and a 56-question version) that teachers could print out. Answers would appear inside the app, and grade reports could be exported as a PDF.

Increasing Customization

A recurring theme from InstaGrade user feedback was customization – different teachers had different needs, and no one answer sheet was perfect.

I need 5 answer choices (A-E) and the ability to select multiple answers
It'd be nice to have shorter answer sheets with less than 24 questions, so my students aren't confused
I need to give different point weights to different questions.
True or false questions!

Since so many teachers had so many different requirements, I decided to ditch one-size-fits-all answer sheets in favor of an online quiz builder that would generate quizzes question-by-question. This had a couple added benefits:

I figured that teachers wouldn't want to type quiz questions into their phones, so I settled on an online quiz builder. This took InstaGrade from a standalone iPhone app to a cross-platform, account-based online service. This complicated the user flow significantly–a downside I hoped would be justified by the increased functionality.

User flow for InstaGrade v1 and v2 – v2 allows quizzes to be created on a computer, at the cost of increased complexity.
The what-you-see-is-what-you-get quiz builder.

Revamping the scanning screen

I redesigned InstaGrade's scanning screen with a couple goals in mind:


A downside of the new scanning interface was that it isn't immediately apparent how to view previously scanned quizzes. It helps that there's only one button – still, I used an animation as an affordance to show users where their graded quizzes could be found.


Tying web and iOS together with a consistent brand

I didn't begin the InstaGrade project with a consistent brand in mind. As I iterated on the visual style pre-v2, a brand identity developed slowly – for the redesign, I codified it, picking a single accent color and a pair of typefaces. I tried to compelement these with simple illustrated graphics, and while they aren't the most aesthetically pleasing, they still play an important role breaking up the monotony of text in places like the onboarding flow.

Outcome

I'd characterize the outcome of the redesign as a mediocre success. Existing users were excited to be able to build customized quizzes, and some adopted them enthusiastically. However, I worry that the added complexity of hopping across platforms – building quizzes on the web and scanning them on a phone – hurt new-user adoption. If I were to redesign InstaGrade again, I'd probably make quiz customization an optional feature – users would be able to sign up and scan generic answer sheets without ever signing up on the web. I'd try to balance the experience between the two extremes of old InstaGrade and new InstaGrade – a simple new-user experience that allows users to ramp up customization gradually.

Visit the InstaGrade website