UX DESIGN
main image photos 2.png

Photo Library

 

BIM 360 Photo Library

CASE STUDY #2

 

INTRODUCTION

This feature was designed for inspectors working in the field, allows them to add individual photos as well as photo groups to their project.

In this case study, I will provide insights into my thought process, the methods and tools I used, and explain my reasoning and thoughts behind the decisions I made.

UX CHALLENGES

  • Creating a unified experience across platforms - iOS/Android/Web

  • Providing a central repository for all photos on a project

  • Easily capture, store, and share project photos

  • Connect other workflows in the app

 
Photos with 3 devices.png

MY ROLE IN THIS PROJECT

UX Design

Research

Visual Design


RESEARCH

I did some research to see how other products were tackling this issue. I also talked to BIM 360 users that have requested adding the photo module to our app. I’ve tried to understand how they are currently dealing with this issue and what are their needs.

Talking to users and start planing

Photo libraries screenshot and workflows.

 

INSIGHTS

Based on my research some of my key findings were:

  • Best practice for Photo Library is probably to keep native behaviour for both iOS and Android users

  • Since our app currently doesn’t offer an in-app Photos Module - some users using the Issue tab for taking and managing photos

  • Users currently using their built-in (native) phone camera for taking photos while on site. They will later share those via messaging apps

 

USER FLOW

Based on my research, I created a rough story-line:

Allnewflow_01.jpg
 

WIREFRAMES - TRYING OUT DIFFERENT LAYOUTS

I started the design process with low fidelity wireframes. 
I tried placing the photo gallery in different layouts, exploring ways of making the experience intuitive and clear.

Explorations for photo layouts.png
Final ux outcome.png
 

WIREFRAME FLOW

After a couple of low fidelity iterations I had the general idea ready.
I laid out all of the pages so I could visualize how each piece related to one another and how a user would access each workflow.

Allnewflow.jpg
 

UX SOLUTION

Considering the feedback on my prototypes , I made some final adjustments:

  • Top tabs for main menu - I added the “Albums” tab to the top menu, so I could use the same behaviour and assets from the app’s document tab

  • Using native behaviour - I decided to use the native behaviour, for both iOS and Android users. I did that in order to keep a familiar and easy workflow for our users

  • Filter & Sort - Following users’ feedback, I have added filtering/sorting for both Albums and Images

  • Working Offline Support - Photos will automatically sync back to account, and will be available to all team members

 
 

Photos tab - taking photos / Filter & Sort

Photos for case study final ux.png
 

Albums tab

Album tab.png
 

Designing for iPad

ipad and iphone 01.png
ipad and iphone 02.png