You are on page 1of 58

Entrepreneurial App Design Prasun Sharma Bro.

Brian Memmott

Table of Content 01 02 03 04 05
Presentation Project Overview Project Schedule Primary Design Process - Research - Brainstorming - Sketching Final Design Process - Research - Specification -Criterias -Personas -Scenarios - Brainstorming - Sketches Prototype Design - Lo-fi Design - Hi-fi Design Testing -Lo-fi Design Elements Detailed Design Final Product

06 07 08 09 10

Schedule
Feb 26 Idea Exploration March 5 Fnal Idea March 7 Research / Interviews / Sketches March 7 Lo-Fi Prototype Design Lo-Fi Prototype Testing March 19 March 21 March 26 March 28

Hi-Fi Prototype Draft 1 Hi-Fi Prototype Draft 2 Hi-Fi Prototype Draft 3 April 2 Hi-Fi Prototype Testing 1 April 4 Hi-Fi Prototype Testing 2 April 9

Final Product

Have you ever wanted to take a picture like this ?

Or a pictures like this ?

But ended up taking a picture like this?

And because of you lack of skill in photoshop ended up with this.

www.qoop.qassup.com

Project Overview
For this project we developed a smartphone app that solves a unique problem that we have identified. Our goal was to come up with an app that doesnt exist yet but that should. This was a semester-long creative project. We had to produce a substantial amount of work to complete this project so everything had to on the pre determined schedule. Outcome: 1. To develop an understanding of all the principles of interaction design. 2. To give value (real and/or percieved) to an application based on usability, design, and composition. 3. To comprehensively document and summarize the research and creative process we followed. Process steps: Identify an existing problem that smartphone technology could solve. Research, conduct and document a visual survey of fot the app with photographs, screen grabs, scans, and/or sketching. Conduct informal interviews with several people to learn more. Develop an appropriate and creative solution that will solve this problem Utilize the capabilities of smartphone technology and the internet Utilize the capabilities of a tablet technology and the internet Utilize research and user testing techniques to substantiate your solution Make observations of their experience with the product, and use their recommendation to further refine the product. Develop a user interface that follows the principles of interaction and design Finalize the product, with everything working, and test the final product, with few other participants. Develop an app icon for your solution Create a presentation, and a process book, that reflects of all the work done throughout the project, identifies the problem, and the user, and shows the result of solved problem. Develop a promotional website for the app to promote the app to the general public.

Brainstorming

Selected Concepts
Concept 1:
A camera app to connect the DSLR camera, and the mobile device. Itll be easier for the photographer to take self portraits, and forced perspective pictures. Pros: The market is too big for this app. There are a lot of students out there, and online learning is the new big thing. Cons: Almost nobody likes to read on a mobile device, tablet, and the website would be fine, but mobile wouldnt work.

Audience: Professional, and amateur photographers, who like to manage their content on the go, and like to take self portraits, and forced Concept 3: perspective pictures. A calorie calculating app. Which would keep Existing Problem: record of your regular calorie intake, and alert No such application exists to connect the you if your going over or below your target. DSLR camera to the mobile device. Audience: Pros: Every weight conscious person who wants There is a huge market of photographers, to keep track of their calorie intake to live a and there isnt any app like this in the healthy life. market right now. Existing Problem: Cons: There is a decent app of this kind, and there The technology to support this app doesnt isnt any which would alert you according to exist right now. the set target.

Concept 2:
Online tutoring application for all the devices including a website. This would be like facebook for students, but instead of wasting time they would learn something. Audience: Students from anywhere. Existing Problem: No such application or website exists, as of now. Yahoo answers is very random this app would be specific to a course.

Pros: There are a lot of weight conscious people out there who want to keep track of there calorie intake inorder to stay healthy. Cons: There are already plenty of calories related apps out in the market, so the competition is too much. Also its not challenging or fun to design, and develop.

Visual Research

Visual Research

Visual Research

Visual Research

Mind Mapping

Mind Mapping

Mind Mapping

Brainstorming

SPECIFICATIONS
Executive Summary:
Making the experience of photography more efficient, simple, and faster.

Criteria:
Priority 1: 1. User will be able to log into the applications, and connect the camera to the phone or the tablet. 2. User will be able to locate all the primary menu buttons on the home screen at the first glance. 3. User will be able to take picture from the home page. Priority 2: 1. User will be able to sort pictures in the gallery menu. 2. User will be able to use the basic edit functions on the edit menu. 3. User will be able to use the settings menu to change the settings of thecamera. Priority 3: 1. Users will be able to use HDR settings. 2. Users will be able to post picture to their favorite social media sites.

Justification:

This application has been designed for a specific audience i.e the professional, and amatuer photographers. The user needs to own, and be acquainted with a DSLR camera to use this app. The user interface of the settings page is based on the DSLR camera, so a regular user will have no trouble figuring it out. The main purpose of this app is to help you take self portraits, and forced perspective pictures by projecting the camera screen on your cell phone or a tablet. This will help you know the exact place, and position your subject needs to be while taking such pictures. Also this app will save users a lot of money, because they dont need to buy a trigger to shoot the picture. Also organization of files become very easy. With the help of the like button, users can sort all the picture they want to spend time editing for further refinement. The pictures liked will appear on the top of the list when they come back to the computer. All the picture will be available on all the devices so users wont lose their favorite picture easily. Also they can use the memory of the camera to store pictures if the memory card in the camera is full. Users will also be able to change the settings of the camera from their phone without having to move the camera position. Also, users can control the HDR settings, and they can see the effect of the different exposure.

USER PERSONA 1
Technical Skills: Knows how to use advanced features of the devices he carries with him. He likes figuring out technology, and is very good at solving new technical problems. Eager to learn new technology, and their features. Persona Description: Kevin is a freelance photographer, he gets clients mostly from networking. He has interest in writing, and editing pictures, and creating posters, and advertisements. Hes also interested in designing articles, and magazines so she has clusters in Graphic design, and Photography. NAME: AGE: LOCATION:

Kevin Takashita 23
Hilo, Hawaii

PROFESSION: Freelance Photographer EMPLOYER: Self employed

Photography: Every semester he gets a few engagement photography jobs. Almost all the time the clients want some kind of forced perspective picture with the ring, or their hands. Kevin has been having problem aligning the client to the right position. Key Goals: He would like to project the view of the camera to the client so theyd know exactly where to stand. Also sometime while taking picture in fast pace thr tripod moves, and the picture is blurred. He wants to click the button remotely. Challenges: He doesnt have money to buy, all the gadgets for the camera, and there is no such app for a mobile device available in the app store. Hed also like to sort his favorite picture right from the phone while hes travelling back home on the bus.

EXPERIENCE: 3 Years STYLE: Landscape / Portrait

Education: Currently enrolled in an undergraduate Communication program with an emphasis on Visual Media. Also has clusters in graphic design, and photography. Technology Skill Level: Novice, Average, Advanced, Expert Devices Used: Canon T3i Computers (Mac and PC) iPad iPhone

USER PERSONA 2
Technical Skills: Knows how to use basic features that he needs to use regularly, and is good at solving new technical problems. Eager to learn new technology, and their features. Persona Description: Malcolm is a freelance student photographer, he doesnt get many clients. He mostly shoots friends, and family. He has interest in creating self portraits. Hes also interested in designing movie posters with himself as the main protagonist. He likes to use photoshop a lot. NAME: AGE: LOCATION:

Malcolm ODonald 26
Rexburg, Idaho

PROFESSION: Freelance Photographer EMPLOYER: Self employed

Photography: During every holidays he goes home, and take family photos. However, there always need to be someone behind the camera to make sure everybody is ready, because the delay timer hasnt been very helpful. He also takes a lot of self portraits with different props. Key Goals: Hed like to control the camera remotely so that he would be able to locate himself to the right position, and angle while taking self portrait. Also hed like to take the group family pictures together instead of running to beat the timer. Challenges: He doesnt have money to buy the trigger, and there isnt any option available to project the camera view to the mobile device so that he could take the self portraits on the first few tries. Also hed like to manage his pictures on the go.

EXPERIENCE: 2 Years STYLE: Portrait

Education: Currently enrolled in an undergraduate Photography program with an emphasis on Portrait Photography. Also has clusters in Graphic Design, and Business. Technology Skill Level: Novice, Average, Advanced, Expert Devices Used: Nikon 7000D Computers (Mac and PC) iPad iPhone

USER PERSONA 3
Technical Skills: Knows how to use both basic and advanced features that she needs to use regularly, and is good at solving new technical problems. She is always eager to learn new technology, and their features. Persona Description: Eva is a photo journalist for Channel 4 News in Hammond, Louisiana. In her free time, she also like to go to new places, and take landscape pictures. She also likes writing news, and blogs regularly. She has a decent number of followers on her blog who follow her regularly. NAME: AGE: LOCATION:

Eva Garnett 37
Hammond, Louisiana

PROFESSION: Photographer / Journalist EMPLOYER: Channel 4 News

Photography: She usually takes picture for her work, and the rest goes to her blog. She goes around town looking for stories, and gets to news venues to gather the news. Theres always competition between News Companies to get the post the breaking news faster than one another. Key Goals: To post DSLR quality breaking news images to Social Medias as fast as possible. Also she wants to organize her pictures better on the go, so that shell save some time, and shell be able to see the most important pictures ready to edit, and post. Challenges: She always has to download the pictures to the computer, and then edit, and format accordingly, before she could post anywhere. She doesnt want to post cell phone quality pictures in her news posts online, but she has no other options.

EXPERIENCE: 3 Years STYLE: Real Time Events

Education: Graduated from Southeastern Louisiana University with a Photo Journalism degree, and emphasis on Broadcasting. She also minored in English. Technology Skill Level: Novice, Average, Advanced, Expert Devices Used: Canon Mark 5D II Computers (Mac and PC) iPad iPhone

SCENARIOS
Scenario 1: Kevin recently got a offer to photograph a couple for their engagement. Like almost every other couples they want do do some forced perspective pictures with the ring, and the sun, and some hand gestures. kevins previous experience with forced perspective has been disastrous. He always has to waste a lot of time editing the pictures in photoshop to make it look like forced perspective. Scenario 2: Malcolm is trying to mimic the Pulp Fiction movie poster with his friend, and himself as the subject. He tried using the timer, and rushing back to the position to get the shot, but everytime hes getting a blurry image, because of the motion he has to make to postion himself. He cannot make the shutter speed any faster. Scenario 3: Eva has just taken a breaking news picture, and she wants to upload it instantly to twitter to spread the breaking news with the picture for the proof. She has her camera connected to the phone, so all the pictures are already available on the phone which can be uploaded instantly to the twitter.

Wire frames

Wireframes

Sketching

Visual Research

Sketching

TESTING LO-FI PROTOTYPE


Introduction:
This calculator was created for someone who has previously used DSLR camera, and has a hobby or a profession in photography. Hence, the ideal test participants would be someone who own a DSLR camera, and is a regular user of the camera. There are three participant in this test, and they were presented with a lo-fi paper prototype, and asked to identify the features, and walk through the app. Participant 1: 45 years old. Married. Has been using smart phones including iPhone for few years. Regular User of DSLR Camera Graphic Design Teacher

Observation:
1. All the participants were able to identify the buttons on homescreen. 2. Participants were able to log in, and were able to connect to the camera. 3. Participants had trouble differentiating if it was button or not. 4. Participant figured out all the navigations. 5. Participants could go back to the previous page, because of the missing back button on all the pages. 6. Participants didnt understand the crop option icon. 7. None of the participant asked about the edit functionality. 8. Participants were confused between settings, and menu. 10. All the participant liked the design, and the concept.

22 years old. Single. Works on campus. Has be been using android device, and DSLR for few years now. Web Design major. Has been Using Canon T3i Participant 2:

Reccomendation:
24 years old. Married. Has been using iPhone for few years now. DSLR camera user for 3 years. Web Design Major. Nikon 3200 Participant 3: 1. Make the sliders big enough for the fingers. 2. The list of cameras on the login page does not look like clickable buttons. 3. Solve one major problem, and dont try to do too much. 4. Put back button on all the pages. 5. Keyboard is missing on the login page.

HI-FI PROTOTYPE

This is the first screen users will see when they first open the app. They need to to select a camera they want to connect to in order to use this app.

This is the enter password screen that appears once they select the camera they want to connect to. They cant just connect to any random persons camera.

This is the home screen for the app, that the users will see once they are logged it. The screen displays the view seen by the camera, and it moves as the camera moves.

This is the gallery page, where all the stored images could be found. They can scroll to see all the images, like them to sort the favorites on the top, and delete unwanted.

HI-FI PROTOTYPE

This is the delete page thatll appear once the user hits the delete button from the edit menu or the gallery menu. They can get rid of the unwanted pictures.

This is the edit menu where they can, make quick edits to the pictures like, crop it, add text, stylize, rotate etc. They can save the edited image or delete them.

This is the settings page where the users can control the camera settings without having to move the camera. They can change shutter speed, aperture, etc.

This is the HDR page where the users can change the HDR settings, and see the different exposure levels so that itll help them to decide on the bracket.

DESIGN ELEMENTS
Icons:
Thie camera icon represents the home button, and it can be clicked to take picture from the home screen. This button is for HDR option, itll show the HDR screen with a different exposure pcitures. This icon is for gallery menu. Itll take you to the page with all the pictures, and help you manage. This icon is for the edit menu. Itll let the users use all the basic quick edit options on their devices. This icon is for the settings menu, where you can control all the settings of a DSLR camera. This icon is for the save button. It can be found it edit menu. Itll let you save the edited image. This icon is for like option which will sort your favorite pictures, and bring it to the top. This is the crop icon in the edit menu. This will let you crop the picture according to your preference. This icon is for text option, and this will let you add text to your images, and post them. This icon is for stylize option. Itll let you choose from the presets for different styles of pictures. This icon is for rotate image. Users can rotate their images to the position they desire. This icon is for delete option. Users can choose to delete the pictures they dont like. This icon is for add description button. It can only be found on the tablet version. This icon is for share option. Users can choose to hide or show the share menu as their desire.

HI-FI TESTING
Questions:
2. The participants was able to identify the 1. Log into the application, and connect buttons on homescreen. 3. Participant was able to take a picture the cell phone to the camera. from the home screen. 2. Take a picture from the home screen. 4. Participant was able to select the third 3. Share the third picture from the gallery. picture from the gallery. 4. Delete the second picture. 5. Participant was able to delete the 5. Favorite the picture. picture. 6. Crop the first picture, and save it. 6. Participant was able to like the picture. 7. Stylize the picture, and rotate is 7. Participant was able to crop the picture. clockwise. 8. Participant didnt know which was 8. Go to the HDR Menu, and explain HDR menu button. what you see. 8. Participant was able to change the white 9. Change the white balance settings to balance. cloudy. 10. Participant was able to change the 10. Change the exposure to -1. exposure.

Introduction:
This application was created for someone who has previously used DSLR camera, and has a hobby or a profession in photography. Hence, the ideal test participants would be someone who own a DSLR camera, and is a regular user of the camera. There are three participant in this test, and they were presented with a lo-fi paper prototype, and asked to identify the features, and walk through the app. Participant 1: 24 years old. Single. Senior. Has be been using android device, and DSLR for few years now. Web Design major. Has been Using Canon T3i

Reccomendation:
1. 2. 3. Add a label to the menus. Add log out button. Slider header in the settings panel is not big enough.

Video Link: http://prasunsharma. wordpress.com/2013/04/11/user-testingvideos/ Participant 2: 24 years old. Married. Has been using iPhone for few years now. DSLR camera user for 3 years. Web Design Major. Canon 60D

Observation:

Observation:
Participant was able to select a camera, and log in to connect it. The participants was able to identify the buttons on homescreen.

1. 1. Participant was able to select a camera, 2. and log in to connect it.

HI_FI TESTING
3. Participant was able to take a picture from the home screen. 4. Participant was able to select the third picture from the gallery. 5. Participant was able to delete the picture. 6. Participant was able to like the picture. 7. Participant was able to crop the picture. 8. Participant didnt know which was HDR menu button. 8. Participant was able to change the white balance. 10. Participant was able to change the exposure. 4. Participant was able to select the third picture from the gallery. 5. Participant was able to delete the picture. 6. Participant was able to like the picture. 7. Participant was able to crop the picture. 8. Participant didnt know which was HDR menu button. 8. Participant was able to change the white balance. 10. Participant was able to change the exposure.

Reccomendation:
1. 2. 3. 4. 5. Make more space for the big picture in the gallery, and edit page. Make the slider header atleast as big as 44 px. Add label to the Menu icons. Make the login options more visible than the logo. Make picture taking more obvious in HDR menu.

Reccomendation:
1. 2. 3. 4. Add a log out button. Add labels to the Menu icons. Make the share buttons hidable in the gallery menu. Make more space for the picture.

Video Link: http://prasunsharma. wordpress.com/2013/04/11/user-testingvideos/ Participant 3: 45 years old. Married. Has been using smart phones including iPhone for few years. Regular User of DSLR Camera Graphic Design Teacher

Video Link: http://prasunsharma. wordpress.com/2013/04/11/user-testingvideos/

Observation:
1. 2. 3. Participant was able to select a camera, and log in to connect it. The participants was able to identify the buttons on homescreen. Participant was able to take a picture from the home screen.

Detailed Design

This is the gallery page, where all the stored images could be found. They can scroll to see all the images, like them to sort the favorites on the top, and delete unwanted.

This screen will appear if the user click on the picture on the board. This will show them options to delete, or favorite the image. They also get option to hide sharing.

This is the screen on the liked option. Liking a picture will prioritize the image, and bring it to the front when opening the images in the computer later.

This is the facebook sharing option. This will let the users to share their pictures faster, and easier.

Detailed Design

This is the delete option which will appear once the delete button is hit. This will open in the same screen making the app faster.

This is the landscape view of the gallery page. This will appear if the users double click the picture.

This is the crop option in the edit menu. This will let the users to crop the picture into the size they want.

This screen will appear when they click the picture once. This will give them options to delete or save the image after the edit.

Detailed Design

This is the rotate option. Users can rotate the picture in the angle they like. to view the pictures perfectly.

This is the stylize option. Users can select from a large set of style preset to make their pictures look better.

This is the settings screen. The background was changed to give it more finished look. If the users select the screen itll bring them down to options on the scroll bar.

This HDR screen will show the users different set of picture from different exposures. They can always change the exposure as they like.

Final Design

iPad Details

The iPad version is very similar to the mobile version. The main difference in this gallery screen is the fancy slider. The main purpose of the tablet version is to manage

the pictures on the go. This will save a lot of time later while editing the pictures. They can sort, and add details to the pictures for future references.

iPad Details

Just like in the gallery of the mobile devices options will show up with the click on the screen. They can delete or favorite the pictures. They can also turn on or off

the sharing options to make more room for the picture. Or they can just share to all the social media with a simple fast touch.

iPad Details

This is the description option thatll pop up once the description button is selected. This will show all the details of the picture that cant be changed like ISO, and F stops

but users can add locations, and more descriptions for further use. It could be used to post on the blogs mostly.

iPad Details

This is the edit menu which will show all the edit options just like the mobile version, but it has more options. Its mainly because with the bigger screen users can

see the changes better, and they might not even have to make further changes in the images in photoshop later on.

Promotional Website
www.qoop.qassup.com