Quote Calculator Application Project Book

By. Chris Bawden

CONTENTS
For this project I have decided to design a chart is because when we tried that we For this project I have decided to design a advertising For this project I have decided to design a advertising advertising work estimate application for were often under pricing clients sometimes work estimate application for the advertising agency work estimate application for the advertising agency the advertising agency that I work for. The drastically and they had to do the math that I work for. The problem that I am faced with, that I work for. The problem that I am faced with, problem that I am faced with, that this app themselves. Plus often it takes the account that this app is addressing, is that time and time that this app is addressing, is that time and time is addressing, is that time and time again Executive hours, sometimes days, to get again account executives will come to me to price out again account executives will come to me to price out account executives will come to me to price the quote back to the client. a design work quote for a client. Now this isnt the a design work quote for a client. Now this isnt the out a design work quote for a client. Now issue. The issue is that these quotes are often very issue. The issue that these quotes are often very This app addresses this is issue by offering this isnt the issue. The issue is that these rough estimates and often dont require me pricing rough estimates and often dont require me pricing account executives the ability to choose quotes are often very rough estimates and the quote with the account executive. And most of the quotelist withof the account executive. from a the preset products in the And most of the often dont require me pricing the quote time the client wants these quotes as soon as possible. time the client wants these quotes application. The premise of the app isas soon as possible. with the account executive. And most of the My solution to this problem is this quote calculator My solution to having this problem is this quote calculator based on the idea of a set price time the client wants these quotes as soon application. application. per hour of design work that we produce. as possible. My solution to this problem is And based on that number you just specify calculator The this app quote is designed to application. give account executives a The app is designed to give account executives a roughly how many hours it will take to simple and fast way to quote potential or current simple and fast way to quote potential or current The app is designed to give account produce a product and the app calculates clients on work. The idea is that they can run a rough clients on work. The idea is that they can run a rough executives a simple and fast way to quote it for you. It even accounts for tax. And quote for the client on the spot then email it to them quote for the client on the spot then email it to them potential or current clients on work. The you can save generic products like posters all within the app. Then if the client feels good about all within the app. Then if the client feels good about idea is that they can run a rough quote or business cards in the app to make the the figure the account executive will price out, with the figure the account executive will price out, with for the client on the spot then email it to process go even quicker. So the account my help, a more accurate quote. my help, a more accurate quote. them all within the app. Then if the client executive choses what product they need about the our figure thekeep account and specifies how many we are creating Thisfeels app isgood designed to help agency up with the This app is designed to help our agency keep up with the executive will and price out,account with my help, a work and thedemands app creates the quote for them. demands of clients help executives of clients and help account executives work moreWith accurate quote. Then once the quote isthis created the account smarter. this application account executives will smarter. With application account executives will executive email the and client theefficiently and will be able to work faster and more efficiently and will be can able then to work faster more This app is designed to help our agency quote from their phone. therefore be able to help bring more money for the therefore be able to help bring more money for the keep up with the demands of clients and agency. agency. help account executives work smarter. For this project I have decided to design a this application account advertising estimate forto create the app The With reason that I have chosen toexecutives create the app The work reason that I application have chosen will ofbe able to work pricing faster and the advertising thata I work for. The chart is because instead making a simple chartmore is because instead agency of making simple pricing efficiently andwe will therefore be pricing able toclients problem that I am faced with, app when we tried that were often under when we tried that we that werethis often under pricing clients help bring more money for the agency. is addressing, is that time andand time again sometimes drastically and they had to do the math sometimes drastically they had to do the math accountthemselves. executives will come toit me to price themselves. Plus often it takes the account Executive Plus often takes the account Executive The reason that I have chosen to create out a design work quote for a client. Now hours, sometimes days, to get the quote back to the hours, sometimes days, to get the quote back to the the app instead of making a simple pricing this isnt the issue. The issue is that these client. client.

CONTENTS
1 Summary 3 Visual Research 5 Sketches 6 High-Fi Paper Sketches 7 iPhone Prototype & Testing 9 Final Product

PROJECT SUMMARY
Soapbox Quote Calculator
For this project I have decided to design a advertising work estimate application for the advertising agency that I work for. The problem that I am faced with, that this app is addressing, is that time and time again account executives will come to me to price out a design work quote for a client. Now this isnt the issue. The issue is that these quotes are often very rough estimates and often dont require me pricing the quote with the account executive. And most of the time the client wants these quotes as soon as possible. My solution to this problem is this quote calculator application. The app is designed to give account executives a simple and fast way to quote potential or current clients on work. The idea is that they can run a rough quote for the client on the spot then email it to them all within the app. Then if the client feels good about the figure the account executive will price out, with my help, a more accurate quote. This app is designed to help our agency keep up with the demands of clients and help account executives work smarter. With this application account executives will be able to work faster and more efficiently and will therefore be able to help bring more money for the agency. The reason that I have chosen to create the app instead of making a simple pricing chart is because when we tried that we were often under pricing clients sometimes drastically and they had to do the math themselves. Plus often it takes the account Executive hours, sometimes days, to get the quote back to the client. This app addresses this issue by offering account executives the ability to choose from a preset list of products in the application. The premise of the app is based on the idea of having a set price per hour of design work that we produce. And based on that number you just specify roughly how many hours it will take to produce a product and the app calculates it for you. It even accounts for tax. And you can save generic products like posters or business cards in the app to make the process go even quicker. So the account executive choses what product they need and specifies how many we are creating and the app creates the quote for them. Then once the quote is created the account executive can then email the client the quote from their phone. For this project I have decided to design a advertising work estimate application for the advertising agency that I work for. The problem that I am faced with, that this app is addressing, is that time and time again account executives will come to me to price out a design work quote for a client. Now this isnt the issue. The issue is that these quotes are often very rough estimates and often dont require me pricing the quote with the account executive. And most of the time the client wants these quotes as soon as possible. My solution to this problem is this quote calculator application. The app is designed to give account executives a simple and fast way to quote potential or current

2 1

clients on work. The idea is that they can run a rough quote for the client on the spot then email it to them all within the app. Then if the client feels good about the figure the account executive will price out, with my help, a more accurate quote. This app is designed to help our agency keep up with the demands of clients and help account executives work smarter. With this application account executives will be able to work faster and more efficiently and will therefore be able to help bring more money for the agency. The reason that I have chosen to create the app instead of making a simple pricing chart is because when we tried that we were often under pricing clients sometimes drastically and they had to do the math themselves. Plus often it took hours, sometimes days, to get the quote back to the client. This app addresses this issue by offering account executives the ability to choose from a preset list of products in the application. The premise of the app is based on the idea of having a set price per hour of design work that we produce. And based on that number you just specify roughly how many hours it will take to produce a product and the app calculates it for you. It even accounts for tax. And you can save generic products like posters or business cards in the app to make the process go even quicker. So the account executive choses what product they need and specifies how many we are creating and the app creates the quote for them. Then once the quote is created the account executive can then email the client the quote from their phone.

AT&T

12:34 PM

SOAPBOX
A G E N C Y
QUOTE CALCULATOR

QUOTES CLIENTS PRODUCTS

VISUAL RESEARCH
The apps that I researched for this app were Clear, Joist, and Invoice ASAP. The style and look that I wanted to emulate came primarily from a combination of Clear and Joist. I used the simple monochromatic tab style from Clear and combined it with elements of navigation and user interface from Joist to help create better mapping throughout the application. And from Invoice ASAP I learned what not to do

CLEAR
DAILY ORGANIZER
What I like most about Clear is the simplistic design and the gestural controls of the app. Its clean monochromatic color scheme and easily mapped gesture control help with this apps simplicity. They offer a simple tutorial at the beginning to learn the gestures and after just a few seconds youre a pro at the application. Plus there are just a couple almost hidden features of the app that, even though they dont hinder the use of the application, help enhance the application once found.

Mapping is a technical term meaning the relationship between two things. (an example is the relationship between controls and their movement and the results in the world) - Donald A. Norman The Design of Everyday Things

JOIST
CONTRACTOR ESTIMATION APPLICATION
What I like most about Joist it the navigability of the app. The designers created a great conceptual model of the system helping the user map out the application with ease. Its the use of simple icons and placement of buttons that makes this possible. There are a lot of features that the app has to offer but because of the design of the program youre never left wondering what those features are or what a button does.

ESTIMATION APPLICATION
The navigability of Invoice ASAP is difficult to map. I used this app to show me what not to do with my application.

INVOICE ASAP

SKETCHES
For this part of the project I just tried to get my ideas out on paper. I this is when I started to nail down the style and look of the app. From these sketches I found that people were able to navigate the app easily.

HIGH-FI PAPER SKETCHES

High-Fi Paper Sketches
After sketches I was a little optimistic and moved right on to high-fi compositions. But before I started on an application mock up that can be used on an iPhone I printed out the screens and did more paper user testing. The test response that I got during this part was not as helpful there werent many issues that the users ran into.

IPHONE PROTOTYPE & TESTING

After I had created a usable iPhone prototype I moved on to more product testing. It was during this product testing that I really learned a lot about what I needed to improve. One of the biggest issues that I ran into during this round of product testing was using the check mark in the upper corner as a finished button. Testers would get stumped when it came time to finishing adding a product to the quote as well as when finishing the quote. The other issue that I ran into is what the users do after they finish the quote. I had designed the so that after you were done with the quote users would press the check mark in the upper right corner. Then the users could send the quote from the home screen. However there was a disconnect with the tester here. Testers got stuck when figuring out what to do to finish the quote process. My teacher advised me that there needed to be an end result in the process that made it feel complete and that it made no sense to back up in the process in order to finish it. To fix these problems of the check mark I found while going through various apps that they had check marks too but the way they had it was the check mark showed up only once the task was ready to be checked off. This change on the screen was a visual cue to the user that that was the next step. So really to fix the issue I didnt need to find a completely different way to signify finishing a task, I just simply made it so that the check mark showed up only when the task was finished. This caused the users to see this change on screen as a visual cue and helped them understand that that was the finishing of that task. To address the issue of having an incomplete quote process my teacher mentioned that through out the quote process the users eyes are being drawn to the bottom and that it didnt make sense to have the eye suddenly drawn up to the right corner. So I added a button at the bottom that says email quote. The reason that I did this was because testers were having trouble knowing where or how to email the quote. They didnt understand hitting the check mark and then sending the quote. Plus the reason an account executive would be making a quote would be to send it to the client. So naturally the end result of the process is to email the quote to the client. Having this button at the bottom gave the quote process a sense of finality to it. It gives the user closure to the process. Especially since after you email the client it drops you off at the Quotes page showing your new quote you just created. This conclusion really helped create a sense of resolution or closure to the process.

Before Test:
The check mark was always present through the process.

After Test:
The check mark appeared only after the step was completed.

Before Test:
The checkmark was used to nish the quote process then sent the quote another way.

User Test Videos:

Here are some screen shots from the videos i recorded of my user testing

After Test:
The check mark can be used but users use the Email Quote button to nish the process.

FINAL APPLICATION
CLICK BELOW TO TEST APP

URL Information https://popapp.in/w#!/projects/52492c331c7f492f0a000a5f/preview 9