App to scan and discover art.
In 2017, I had the opportunity to work in one of my company’s most innovative projects, Smartify. I worked with the team for around 6 months, and helped in the redesign of the app along with a few other things. Let me take you through the journey of my experience reimagining the product.
What is Smartify
Smartify is an app that allows you to scan a piece of artwork and identify them, accessing background information on the piece and/or the artist. You can build up your own curated gallery and explore Smartly venues around you.
An early app concept was available to the public already. My colleagues had worked really hard to create this MVP and test the potential of Smartify in different venues. Post this phase, the app gained popularity and a bigger team was commissioned to implement more functionalities and potentially, redesign the navigation of the original app. I took a big part of the responsibility for designing, ideating and refining the final deliverables of the product for iOS and Android. I collaborated with another designer for producing the material.
There were multiple assignments I worked on during my time with Smartify. However, I will focus in perhaps the most challenging one: the navigation redesign.
The app main flow was pretty straightforwards: new users go through the walkthrough and login or signup. Then, they will be presented with the dashboard. The main camera is active and ready to scan an artwork. The process is intended to be fast an easy to accommodate visitors in the venues, and not disrupt their experience.
In the tap bar you could switch to switch to your artwork collection or back to the scanner. The collection displayed your favourited artworks and previous scans.
From the dashboard you could access a side menu where additional content was located.
Growing app with new features
At the initial stage, the app only had one main functionality: scan and read the artworks’ details, with the option to save it in your collection. Soon, it became obvious that the current navigation was insufficient to host more features and that some reshaping of the architecture was needed.
The new features introduced when I joined where locating venues around you and the exploring screen
Thinking in products not features
The app was very successful for a simple reason: how easy and straight forward it was. Introducing new features and maintaining a simple architecture can become a challenge. Our case was no exception. For almost a month the main stakeholders and us came back and forward with ideas and proposals to achieve the app experience we imagined.
Market research and user testing
To get some quality inspiration an insights, I spent some good amount of time testing and analysing successful apps in the market and their architecture/navigation. The majority were using tap navigation with the exception of Snapchat and the new redesign of Shazam at the time. These became quite a favourite of mine, and I studied them in detail.
For instance, I tested with some colleagues the usability of the Shazam redesign.
Image credit: Macstories
Based on the interviews some key insights were found:
- The majority of Android users were pretty confused with he swipe gesture on transitioning to screens. They automatically tapped on the top icons, as this is a common pattern in Android devices.
- Many agreed that the sections were not very clear. The moment you are on Discover or your profile, the three dots are insufficient to clearly state the other available sections. Additionally, you lose the possibility to access the third section. You are limited to swipe back to the dashboard in the case of profile and discover.
- Some were gladly impressed to see this innovative navigation and accepted it with interest. Most of these users had iOS devices, and were familiar with swipe gestures to reveal and access content.
I always start with pencil sketches
After I had gather al of these insights and my mind was full of ideas, I began the sketching process. I always have with me an sketchbook or scrap paper were I can capture my ideas. Sometimes it’s just words and random flows, that then evolve naturally into low-fi wireframes of the concept.
At some point, I have enough to begin the digitalisation process, and take the step further to create some nice-looking wireframes on my computer. I most commonly use Sketch for wire framing and then prototyping. On the early stages I stay away from focusing on details an making pixel perfect designs.
In this case, the stakeholders required for very visual and as close to finish concepts, so I kept the designs pretty polished already.
Bellow are some scans form my sketchbook, that then evolved to the digital concepts.
Concept 1: The navigation is divided into three sections: explore, scan and collection. I played with different ideas to place the tap bar at the bottom or top. Also, I considered the swipe gesture and different visual interfaces for the sections.
Concept 2:Again a three section navigation, but in this case: internal search (venues, artworks, etc) scan + explore and collection.
Concept 3:familiar bottom tap bar as the main navigation. More sections are highlighted and accessible in this concept: explore, venues, scan, collection and settings.
Detail in the experience
I made several high-end variations of these concepts. It was not an easy task to get were we wanted to. We had high expectations for the redesign, and wanted to be innovative yet intuitive for our regular and new users. So, there were multiple iterations and animated prototypes to really understand the experience we wanted to achieve. During this process I was in constant communication with my colleague developers understanding the complexity of the designs and new architecture. It would take some work, but if the result was as expected, it was worth it.
Play carousel to see more
Prototype of one of the concepts that did not make it to the app.
The final result
After some back and forward with the stakeholders and with input from the developers, we settle on the approach bellow. The simple navigation and architecture keeps it true to our original aim: a straightforward app that’s not intrusive. We stayed swayed form swipe gestures to change from section to section. The iconography was designed to really reflect the section the user is directed to.
The design was throughly translated into instructions for development. In little time, the app was tested, deployed and ready to live.
What came next
Smartify has now over 30 different venues across the world. It has won several recognitions such as the Webby Award for Best Use of Mobile Camera an Art & Experimental, and the GloMo Awards for the Most Innovative App.
The team is very proud of these achievements and is constantly looking for ways to improve the app.
Read more about Smartify or download the free app here
My time working in Smartify was incredibly rewarding. Working so closely with the stakeholders and engineers helped to develop a strong understanding and experience.
Validating concepts early in the process is key to avoid assumptions and clearly involve the end users in the process. Big or small tests are simply necessary.
Smartify was one of my first projects in my career. I have gone a long way since then, but I feel definitely proud of the achievements the team made and all the take-aways from this experience.
Next work >