Can we enable users to continue interacting with a whiteboard on their mobile device?
It's a familiar scene - you've been hammering out great ideas on the whiteboard with your teammates. The meeting wraps up (or you're kicked out of the conference room), so you grab your phone and take a photo of the whiteboard. What happens next? The photo languishes on your phone, or at best gets attached to an email that nobody ever refers to again. Wouldn't it be better if your team could continue working on your whiteboard collaboration as an interactive document - text, drawings, and all?
I led the design of SMART InkScan, a mobile app that converts handwritten artifacts into digital SMART ink™. Users can begin brainstorming on a whiteboard or even the back of a napkin, and seamlessly continue working from their mobile device. For users with access to a SMART Board, InkScan converts your photos into digital ink and sends them directly to a SMART Board, allowing teachers and students to continue working interactively with content.
I received a promotion and a company award for my work on this project.
- Role: Lead UX Designer
- Tools: Sketch, InVision, Zeplin, Confluence
- Timeline: June 2017 to February 2018
- Alison: Lead UX Designer
- Manat: Product Manager
- Jeff: Dev Manager
- Ram: Test Manager
- Serena: User Researcher
InkScan was a greenfield project - not building on any of our existing products. SMART has unique tech, and wanted to share it to make people’s lives easier. The tech converts handwritten text into digital ink that can be scaled and manipulated. It allows users to take static content and make it interactive. My UX challenge was figuring out exactly how to apply that tech to solve real user needs.
The key questions at the beginning of this project were these:
- What user needs can we address with this tech?
- What kind of app should we build?
- Should it be optimized for a phone or a tablet? (it would be responsive, but we needed to know the main use case)
Continue is a Top Need
I dug into SMART’s prior User Research to uncover unmet needs. It showed that the ability to continue work on a whiteboard (and in general) was a common user need. InkScan could allow us to satisfy this unmet user need.
After determining that "continue" was the user need we could best solve with this tech, we needed to decide exactly what type of productivity app to build. There were 3 types of productivity apps that would make good use of our tech - a note-taking app (like Notability), a general productivity app (like Evernote), or a scanner app (like CamScanner).
For this project, I took on many tasks normally handled by a Product Manager, since SMART's PM org was understaffed, and our (very competent) PM was overextended.
In order to keep the project moving ahead, I took on tasks outside of the usual UX Designer role, such as conducting extensive competitive analysis, looking at monetization opportunities, total available market, the market share of existing apps, different types of productivity apps, and comparisons of their feature sets.
I determined that the best use of our tech would be a scanner app that could allow users to continue their work. Our tech would allow users to continue to interact with the original content, not simply capture and then annotate on top.
After determining that we should build a scanner app that would allow users to continue, we needed to decide whether it should be optimized for a phone or tablet. Our assumption was, to record an idea before it’s gone, you’ll work with the device you have on you - your phone. We validated this assumption with users. We asked ~270 scanner app users what device they use. The answer was clear.
270 participants completed a screener survey. Then 42 participants answered detailed questions, and submitted actual scanned artifacts. We showed those users a demo of digital ink, and they evaluated its perceived usefulness.
Our demo showed a photo of a whiteboard being converted to digital ink, and then the user was able to interact with the original whiteboard content. The demo and their quotes are below.
Unlike our other software products, InkScan was aimed for a general audience, not just education. As the design progressed, the aim stayed the same, but we discovered impactful ways to distinguish it from other scanner apps, while integrating it into our ecosystem in a unique way. If a teacher has access to a SMART Board, then they get bonus functionality and more ways to continue their work - not just on their mobile device, but also on the SMART Board.
I did some "quick and dirty" user research by analyzing the reviews of popular scanner apps to discover unmet neets. By far, the biggest unmet need was being able to easily scan multi-page documents. Early in the design process, I made this a priority in my interaction flows.
I determined that there are 4 main types of artifacts which get scanned: printed documents, receipts, whiteboards, and handwritten notes. The printed artifacts have different user needs than the handwritten ones (for example, a printed document might require a signature, a handwritten note wouldn't need one), so I designed two different document-type flows through the app, with specialized sets of tools.
The design constraints for this project were challenging and fun. It was my first time designing a fully-fledged iOS app. I had to balance iOS design guidelines with SMART branding and the constraints of a very small screen size.
Below is a prototype of the app created for testing, and communicating the interaction flows to our dev team.
Marketing and Branding
As the design progressed, I stepped up to help with marketing - the best ways to market the app on a budget, how to set up the pricing structure (it's a free app with in-app purchases), what to name it, and how we could market it without a dedicated marketing team. SMART's Marketing team is experienced in selling hardware and software for education, but not a general market mobile app, so this was a bit of an experiment for the company.
We used two main methods to test SMART InkScan before release - heuristic evaluations, and an internal beta release. The beta release provided extensive UX feedback, and uncovered several bugs for our developers to fix before the public release.
This mind map created by our Test Manager shows an overview of the actions available to InkScan users.
I worked with our Documentation Team to produce this video demonstrating how to use InkScan.
In about 8 months, our small team built a mobile scanner app. Our key differentiator is “digital ink” – the ability for the user to continue to interact with the original content, not just annotate on top of it. We launched in February 2018. Here are some of our metrics and reviews.
Personal Growth and Recognition
While working on InkScan, I was promoted to Senior UX Designer. I also received the President's Club Award, an internal company award which “recognizes an employee who exhibits exceptional performance, exceeds job requirements, and displays initiative.” Below are some quotes from the award presentation. This particular award is pictured in the center of the photo below (the other awards are ones I received for other projects at SMART).