About This Project
Instagram wants to diversify its revenues stream beyond just advertising by allowing users to customize and purchase physical versions of their photos. The goal of this project is to seamlessly integrate a print feature into the existing Instagram User-Interface, while continuing to keep users engaged with Instagram's primary MVP-- the creation of imagery. The key challenge: maintaining a fluid, consistent, brand identity, alongside a simple, intuitive user-experience.
Our Solution: PrintStudio
PrintStudio is exactly as it sounds--a full-service Print Studio offering consumers a variety of formats, products, and customized print-options to fit the needs of every type of creator. With a button seamlessly integrated into the profile page of Instagram, users can effortlessly enter into the flow of purchasing prints of their images without the hassle of using a third-party service. The experience acts as a natural extension of the Instagram brand, while providing users with a process that is fluid, intuitive and time-efficient.
A Place where Photos Come to Life
As human beings we are the only organisms that create for the sheer pleasure of doing so. Whether it is capturing our visits around the world, documenting a favorite meal, or archiving family milestones, we are the happiest when we are creating. Living in a digital-era is changing the way we communicate--snapping thousands of photos is now at the touch of our finger-tips every second of everyday. This access has created a beautiful opportunity for us to hold onto moments, rather than watching them go by and eventually be forgotten. InstaPrint brings those moments of joy off your device and into your life. It opens a space where those memories can come to life and live on...
Empowering the Creative in Everyone
We are only as wonderful as the community behind us. We know creativity ignites when the right tools are available to us. Our goal is to provide those tools to our creators to constantly keep them inspired and making the prints they love. InstaPrint offers products and customization for every type of user, cultivating a community of storytellers, designers, mover's and shakers', and thinkers across the globe.
Quality Assurance + Transparency
We are committed to making your photos shine. All of our products are created with purpose and love, and we strive daily to be innovators in design. We source only the finest materials and offer a number of recycled and eco-friendly options to help preserve and respect the very places that inspire us. As advocates for transparency, all of our products have clear and detailed descriptions and example imagery, leaving no creator in the dark on their purchases.
Prints in Minutes
In a world of hustle and bustle that is difficult to shake, we know the importance of efficiency and value your time accordingly. Our quick and easy checkout, and seamless flow from start to finish, allows you to order prints in a matter of minutes .
Creating a Lasting Legacy
We believe in the story that is archived for future generations. InstaPrint makes it possible for your memories to live-on in a world beyond the screen.
Highly collaborative team from conception to deliverables. Led the visual design through sketches and creation of hi-fi prototype.
Facilitation, Business Development, User Research, Strategy, Wire-framing, UI Design, Branding.
THINGS TO CONSIDER
- Identify where to incorporate this feature
- Comprehend how people edit and customize photos to print
- Design a flow for selecting and editing photos
- Design the checkout and delivery flow
- Design key screens using the look and feel of Instagram
- Discovery & Research
- Sketching and Ideation
- Narrowing Scope and Structure
- Prototyping and Testing
MVP Facilitation + Discovery
To ensure we kept Instagram's existing business model in mind during the ideation process, we made our first deliverable to map Instagram's current Business Model. This visual chart depicts the company's value proposition, infrastructure and customer needs.
Business Model Canvas
Once we had a better understanding of who Instagram was and what they were looking to achieve,
we researched the market, looking for companies, agencies, brands and organizations that were achieving similar goals.
Companies that fit the profile included Artifact Uprising, Social Print Studio, and Sticky Nine. In order to devise the optimal printing service for Instagram, we closely examined the pros and cons of each printing service with the intention of integrating the best solutions into a solid user flow.
- Artifact Uprising — it’s clean and uncluttered UI, clear call to action, judicious use of white space, intuitive navigation, and impressive product range set the bar high for our forthcoming product.
- Sticky Nine did not have quite so much to offer despite the wide variety of options on offer as well as functional diversity. It’s plagued by unclear calls to action and an awkward checkout flow, and it doesn’t offer the same caliber of visual experience as does Artifact Uprising.
- While Social Print Studio’s minimalist, unobtrusive screens provided inspiration for our project, we noted a partially confusing UI and unnecessary screens which we did not wish to emulate.
In order to craft and integrate a print feature into Instagram, we first needed to thoughtfully develop our MVP. To begin, we focused our user-research on the following questions:
Who uses Instagram today? Who is our target audience?
What are the behaviors we need to mimic/replicate when designing our new feature? What 3rd party services are they using and how is that experience? What would be the most common use-case for this new feature?
Why do people use Instagram? Why would people want to print their Instagram images?
How are users currently printing their Instagram photos? How do users engage with the app both socially and from a image creation stand-point?
Our research process began with three interviews. We chose users with different demographics to gain insight on Instagram through various vantage-points. The goal of these interviews? To answer the questions listed above and to narrow in on our MVP.
What were some key take-aways?
Map icon on Profile page is irrelevant. We found when asking questions about Instagram and it’s various features, that users rarely use the map icon on their profile page, and in several instances users were not even aware it existed. This notion was supported even further when we held contextual inquiry sessions, and led us to determine the placement of our new Print feature.
Brand loyalty/affinity. If there was a new print feature integrated into Instagram, users would use the service provided by Instagram over a 3rd party provider.
Current print services are not ideal candidates for digital printing.Users were not always aware of third-party Instagram print services (i.e Sticky9, Artifact Uprising). For users who had printed their digital images previously, their experience with those services often times was dissatisfactory, timely, and overall inconvenient.
Price, Quality, and Time, were the key factors users cared about when it came to digital photo-printing.
Gifts and Decor would be the primary use-cases for photo-printing.
Now that we had pinpointed some immediate needs from speaking directly with users and analyzing competitors, we were able to develop tailored survey questions to dig deeper into the “why” which would ultimately lead us to the “how”. The goal of these survey questions to solidify user demographics, behaviors, and needs which would go on to form our persona.
Meet Janet Mason . Janet’s persona was derived from the overarching criteria gathered from surveys results, interviews, and initial user-research. Janet is a 28 years old conceptual photographer, and currently resides in East Los Angeles where she has a live/work space. In her spare time Janet enjoys drinking coffee with her friends, attending creative events, globetrotting, exploring LA, taking photos, and dancing salsa.
Seamless, simple, intuitive flow that does not hinder the creation of imagery
Clear product details screen (paper type, weight, options)
Unobtrusive, easily accessible “print” feature
Variety of products (photobooks, posters, cards, loose prints)
Easy access to order information / history
Quick and easy checkout process
Clear review of final product prior to purchase
Social integration / functionality
Consistent look and feel of Instagram brand throughout entire flow
Checks Instagram several times a day
Posts a few times a month
More of a lurker than a creator
Concerned with privacy
Cares deeply about the quality of the products she purchases
“The holidays are quickly approaching and I need to buy personalized gifts for my family and friends on a budget”
We started our ideation process by card sorting features and results from our research. This helped us keep our scope narrow, and avoid integrating an influx of features that were not necessary. From there we could begin sketching our initial user-flow.
Here was the proposed user-flow we derived from our initial sketching and white-board sessions.
This was our revised user-flow after user- testing our paper prototypes.
Here was the final user flow developed after testing our hi-fi mockups.
After going to the drawing board and sketching our initial concepts and user flow, we were able to begin wire-framing. Our wire-frames evolved through three rounds of design, testing, and iteration:
1.Paper prototype → 2.Lo-fi prototype → 3.Hi-fi prototype
Our first course of action was to have users test our initial flow via paper wireframes. We did this by hand-drawing each screen, and recording how users interacting with those screens on our phone. This step was crucial in our design process as we were able to iterate on our user-flow and designs before even going into hard-wires (sketch).
After our first round of testing, we iterated on the prototype until the user flow worked for every user. A key insight that arose during testing was that some users wanted to enter the user flow from different elements on the profile. For example, the profile screen features a “printer” icon with which the user can enter the flow for ordering prints. However a significant number of users preferred to enter the flow by tapping on a photograph rather than the icon. We had to account for that in our design, so we eventually implemented an alternative user flow allowing the user to select an image and then enter the user flow.
Users wanted to navigate with progress bar
Users wanted to access print studio through photos
Paper prototypes lacked cues to guide user
Make checkmark symbol clear
User not certain what to do after checkout
Reordered user flow to put photo selection at start
Included review of purchase at payment
Changes to visual design to reflect Instragram brand
Changes to nomenclature
Replaced checkmarks with arrows
Lo-Fi Wireframes + Prototype
After we had adjusted our designs based off our first round of testing, and were assured that users could easily complete the task of ordering prints, we created wireframes in Omnigraffle. Once those were completed we pulled the screens into InVision and start our second round of usability testing.
The first user-testing finding listed above was taken care of through initial testing of our paper prototype. In order to address the other two, we simply eliminated the progress bar, which had only confused users, and we turned selection fields into buttons so that the user could progress more quickly through the flow. These iterations paved the way for us to work on the high-fidelity mockups.
USER- TESTING FINDINGS
- Users wanted to access print studio through photos
- Users wanted to navigate with progress bar
- Users thought selection fields were buttons
- Turned selection fields into buttons
- Eliminated a progress bar
- Clarified concept of social function after checkout
- Added selected states and duplicate functionality
- Eliminated arrows on screens with calls to action
- Re-ordered screens
- Added alternative flow
Once we wrapped up our second round of usability testing, we were able to start creating our hi-fi mockups in Sketch. This is where matching Instagram’s brand aesthetic was crucial, and where we spent our time ironing out the visual design. Once our mockups were complete we pulled them into InVision and began our third and final round of usability testing.
USER- TESTING FINDINGS
- Final review screen was unsatisfactory
- Should be possible to make changes in final review
- Shipping info could be filled in automatically
- “Payment method” confusing because of progress bar and tabs
- Hashtag placement at top of page
- Removed “selected state” screens for the Product page and Size page
- Changed navigation (arrows), Removed arrows on screens that automatically advance (set of prints, size screens)
- Removed arrows on screens with buttons (cart screen, confirmation)
- Added guiding messaging/banners so users know what to do
- Changed layout/format of ‘Final review” screen
- Visual Design updates & tweaks
- Streamlined copy and language throughout
- Added an “order” screen, and a “hashtag” screen
- Added feature notification/pop up to profile page
- Should users be able to print other people’s images?
- Should shipping options be included?
- Ensure that pricing and shipping modalities are in line with business goals
- Add ability to make changes to order on final review
- Automatically fill in known personal information fields
- Increase size of typeface across all screens