DSLR Contoller App
Anyone who has worked in a photography studio knows that a large percentage of photographers shoot tethered. This is when the camera is connected to a laptop or tablet and allows the photographer to control the camera and see the images on a large screen for review. The most common way is to use a laptop. However, some free apps have been developed which allow photographers to have full control over the camera from an Android or Apple tablet and live playback images for review. Apps like dslrdashboard work well however, the user experience needs to be improved and using it on a phone is almost impossible. The app has multiple buttons on the main UI that are hardly ever used by a pro-photographer and the settings they control never need to be changed e.g: image quality, image size and metering settings. The unprofessional appearance when used is also a big problem as one of its main functions is for the client to review the images.
I have been looking at each element of the app, and researching all the functions on a DSLR camera most used when in a studio, and am now working on designing my own DSLR controller app to better fit the needs of a pro-photographer and make it easier for amateurs to understand and use as well.
The Design Process
UX Research and Concepts
I started this project by defining what the photographer actually requires control over and what other requirements they have when shooting and reviewing photos. I brainstormed my ideas using post it notes and once I was happy I then organised them into groups according to importance.
After prioritising the needs of the user I created a number of user stories that I would work threw to create the best outcome.
- As a photographer, I want to connect my DSLR and capture an image.
- As a photographer, I want view exposure reading and take control of the cameras exposure settings.
- As a photographer, I want to view my image after capture with a histogram for review.
- As a photographer, I want to view other images on the cameras SD card.
- As a photographer, I want to control in-depth settings on the camera.
- As a client, I want to view images captured by the photographer.
The most important requirements would have their own buttons on the main UI. The next important would be in a pull out drawer. The least important would be in the settings menu.
Next I created a number of simple concept wireframes and reviewed the pros and cons of each.
I then recreated the wireframes in cardboard to the exact scale.
Each element was attached using blue tack. This means elements can be moved easily. Photos of each stage would act as a record when new layouts were tried.
With a sponsor user I tested the first user story and together we analysed how effectively the task could be completed.
The original idea was to not use a capture button but instead the user would just press where they wanted to focus and the photo would be taken automatically. User tests revealed this was not an intuitive interaction and felt clumsy and it often became difficult to reach. Having to do this for each image was not ideal.
Because of the problems encountered a shoot button and AF button were added.
I started with the shoot button in the middle of the app as this is a standard placement for many camera applications. I retested the user story and we quickly realised that the placement of the button was not ideal as it was beyond the comfortable reach of the user even on a relatively small tablet device.
Because of this I decided to do further research on the most accessible areas of a tablet screen and created an image that represents my findings. The green areas represents the areas that are most comfortable for interaction.
For right handed users that, according to my research make up 89% of the population, I found that the right hand side is the preferred area for interactions. Using this data I then worked on an adapted layout and placed the buttons that are most important on the right hand side. The shoot button that would be the most used was also in the centre of the green area.
The less used buttons were moved to the left side with the tools drawer pull in the green sector of the usability map.
The design was then re-tested by the users and modified before the next story was tested.
The layout was then re-created into a simple digital wireframe ready to have the visual elements designed.
Before starting the visual design on the app a number of rules were created for the type and colour. The iconography would also follow IBMs icon template to ensure consistency throughout the project.