le calculator process book final

7/28/2019 Le Calculator Process Book Final

1/41

Process Book

Designed By: Prasun Sharma

Evaluated By: Brian Memmott


2/41

able o Content

Presentation

Project Overview

Primary Design Process- Research- Brainstorming- Sketching

Final Design Process- Research- Specication- Brainstorming- Sketches

Prototype Design

esting

Design Elements

Detailed Design

Final Product

0102

03

04

05

06

07

08

09


3/41

Tis is the rst screen or the home screen thatusers see when they click the application icon.

Round buttons because it provides more space around it,making it easy to hit.

Rounded rectangular buttons contains list o trigonometricvalues, and they can be scrolled let to right.

Smaller screen because it only records equations

Space below the screen is or error messages, and answers.People dont like pop up error messages, or the error messagesstarting on a new page.

Home Screen

Tese buttons appear when the user dragsthe screen on the groups o buttons or simply

clicks the arrow key at the corner.


4/41

Tis is the screen users will see when they starttyping or writing the equation.

Te message bar below will notiy the correct orm oequations to be entered.

Done button is higlighted to let the user know thats the nextbutton to hit.

Buttons are highlighted once pushed, to givr a eedback.

In Process Screen


5/41

Tis is the screen users will see when they aredone typing or writing the equation, and theequation is correct.

Message bar shows the value in green.

Done button is still highlighted to let people know that thenext button to push.

End Process


6/41

Tis is the screen users will see when they hitdone in the home screen.

Tis screen displays the graph or the equation entered, andthe equation is displayed on the let side o the screen.

Tis screen also brings out the various unctional options,and settings option, at the bottom o the screen.

Graph Screen


7/41

Tis screen is the continued screen rom thelast one, but with one diference.

Users can swipe the equation tab on the top right to selectdierent equations saved.

Te little round white dot will let them know what side oequations are they looking at.

Tey can minimize the tab by clicking the downarrow button.

Swipe Equation


8/41

Tis is the screen when users zoom into thegraph screen to look at it more closely.

Tis screen can be zoomed in or zoomed out, by dragging thetwo fngers in the screen to look at the graph more closely ortoo view the whole graph.

Zoom In Screen


9/41

Tis is screen is same as the previous one withone diference its graph is zoomed out.

Like the previous screen they can drag the screen withtheir fngers.

Once done they can hit the reresh button at the bottom tobring it back to original position or just drag to bring it tooriginal position.

Zoom Out Screen


10/41

Tis is the screen users will see when the notesbutton is hit on the option bar.

Here users can selected the pre saved notes.

Te edit button will let them delete the notes.

Te plus button will let them add new notes.

Done button will take them back to graph.

Notes Screen


11/41

Tis is screen appears when users hit the editbutton.

Te delete icon appears on the let, and once pushed it lldelete the note rom the database.

Delete Notes


12/41

Tis is the notes screen when the button isselected.

Standard iphone buttons and highlights are used to make itmore amiliar, and easier to use.

Selected Button


13/41

Tis is the screen users will see when one othe notes listed is selected.

Equation, and its name is given on the top.

Notes describing the ormula is written below it.

Once again standard iphone keyboard used or amiliarity,and simplicity.

Library icon on the right will let the user to add theequations in the notes to the library.

Notes Detail


14/41

Tis is the library screen users will see whenthey hit the library button rom the homescreen or the notes screen.

It lists all the ormulas.

Te standard iphone select icon lets people know that theycan be selected.

People can add ormula to library by clicking the plus buttonat the bottom as well.

Edit button will let them delete only the equations added bythe users.

Library Screen


15/41

Tis is the library screen when the button isselected.

Standard iphone buttons and highlights are used to make itmore amiliar, and easier to use.

When selected it will show the graph to the selected equation

Selected Button


16/41

Tis is the settings screen users will see whenthey hit the settings button on the bottomright o the graph screen.

Standard iphone buttons are used or amiliarity, andsimplicity.

Library could be reset to the previous state.

Sounds, and backgrounds could be changed.

Settings Screen


17/41

Project Overview:

Te main purpose o this assignment was toexplore buttons, conventions, and eedback

three important concepts in interaction design.

Outcome:

1. o develop an understanding o buttons,conventions, and eedback.

2. o give value (real and/or percieved)to an online calculator based on usability,design, and composition.

3. o comprehensively document andsummarize the research and creativeprocess you ollowed.

Process steps:

Research, conduct and document a visualsurvey o our unction calculators withphotographs, screen grabs, scans, and/orsketching. Observe people using a ourunction calculator. Conduct inormalinterviews with several people to learnmore about the role o calculators today.Collect examples o buttons.

Create a wire rame or each unique layoutdiscovered in your visual audit explore awide range o design ideas.

App and web style survey - collectexamples o app and web based design that

can be used to inorm you design decisions.Analyse three in-depth. Computer Compsexplore a wide range o design ideas ora calculator.

Choose one direction and begin designrenements, and nish design renements.

Create prototypes, identiy the target users,and start testing the prototype.

Make observations o their experience withthe product, and use their recommendationto urther rene the product.

Finalize the product, with everythingworking, and test the nal product, withew other participants.

Create a presentation, and a processbook, that reects o all the work done

throughout the project, identies theproblem, and the user, and shows the resulto solved problem.


18/41

Primary Research:


19/41

Primary Research:


20/41

Primary Research:


21/41

Primary Research:


22/41

Primary Brainstorming:


23/41

Primary Sketches:


24/41

Primary Sketches:


25/41

Selected Concepts:

Concept 1:

A Gesture calculator designed or children, sothat they can learn math at home beore theygo to school.

Audience:Children aged 6-12 who are just learninghow to write numbers, and add, andsubtract them, and their parents who canteach them math everyday to help themovercome the ear o math when theygrow up.

Existing Problem:No such calculator exists to help parentsteach children how to do math.

Pros:Tere are enough Asian parents like minewho would be willing to use this calculatori it bring any help to teach math.

Cons:Not all parents might let the child playwith iPhone. Children might get distractedrom the drawing screen, and might justkeep playing with it.

Concept 2:

A calculator design or an online communitycalled Imgur.

Audience:A regular Imgurian, any age.

Existing Problem:No such calculator exists with imgurtheme, that imgur community couldrelate to.

Pros:Tere are a lot o people in imgur who will

be willing to try this calculator at least once,just because o the loyalty to the site.

Cons:Tere nothing special about this calculatorother than the theme o the calculator.People wont be use it or a long term.

Concept 3:

A graphing calculator designed or students

who have to take ew calculus classes, but dontwant to buy a graphing calculator.

Audience:A non math major college student who hasto take calculus classes, and doesnt wantto spend a lot o money on a graphingcalculator which theyll need, but has veryew uses.

Existing Problem:Existing calculator at the app store, are verycomplicated, and expensive.

Pros:Itll have just the basic unctions neededor the Calculus I, and II classes. I knowpeople who would actually buy a calculatorlike this.

Cons:

Cell phones are not allowed in tests. Acell phone screen will be too small or acalculator with so much unctionality.


26/41

Concept Explored :

Summary:

Ater the rst exploration o the concepts, I

realized that there isnt anything interestingabout the rst two concept. All o thosegesture related calculator has already beencreated by past students, and are beingexplored by current students. I got moreinterested in the graphing calculator,because it was more challenging. It wouldbe very dicult to t everything in a small

screen. Also there arent many graphing

calculator in the market right now. Ithought o solving the data storing problemas well with this calculator, and consultedew riends who had taken calculus classesto help me gure it out. Te completeprocess in creating the calculator design isexplained next.

Gesture Calculator: Tis is the concept or the

calculator or children.

Imgur Gesture Calculator: Voice controlcalculator or imgurians.

Imgur Calculator: Tis is the concept calculator

or imgurians with the theme color o imgur.

Graphing calculator: Tis is the basic concept orthe graphing calculator.


27/41


28/41

Specication:

Executive Summary:

o help students save money on GraphingCalculators, with more useul, and easier app.

Justication:

Tis calculator has been designed or aspecic audience i.e students who haveto take ew Calculus classes, but are notMathematics major. Te main purposeo this calculator is to save user moneyon Graphing Calculators, because those

students have no use or them atertheyre done with the two calculus classes.Graphing Calculators cost over $80 each,and with this app they wont have to spendso much money or just two classes. Tisis designed with the minimum eaturesrequired or Calculus I and II, thatlladdress the problem o the students.Te main purpose o this calculator isto solve equations into Graphs. Also to

make lives easier I added a library whichcontains some o the most used equations.Tis will save students time on typingequations everytime. Also they can add,and delete equations rom the libraryanytime. I also added a notes eature whichwill help students to take notes relatedto the equations, so that they can reerback to it later. Tey can add, and deletenotes anytime.

Criteria:

Priority 1:

1. User will be able to take ull advantageo this product, and will not need to buya Graphing Calculator.

2. User will be able to locate all theprimary buttons on the home screen atthe rst glance.

3. User will be able to get to the graph

screen on the very rst try.

Priority 2:

1. User will be able to add, and deletenotes.

2. Access to library content, and theirmanagement will be easy.

Priority 3:

1. It ll be easy to change settings.


29/41

Persona:

Name: Bobba FettAge: 22Residence: Denver,COEducation: B.Sc. Bio echnologyStanding: JuniorOccupation: Lab utorIncome: $10,000Marital Status: Single

Bobba Fett is a student at University oDenver. Hes Bio echnology major, and

hes studying in his junior year. Eric is ahardworking active young man who likesto get his work done on time, and liketo play draw something with his riendson his iphone. Bobba requires to takeCalculus I and II, and a Mechanics classas core classes or his major. He doesntneed a graphing claculator or his CalculusI class, but it d be helpul, but he needsthe basic eatures o it or Calculus II, and

the Mechanics class. Apart rom thosetwo classes he has no use or a graphingcalculator.

Bobba usually borrows a calculator romthe Math lab, but it has to be returned thenext day or renewed to use another day.Tis has been very rustrating or him. Hedoesnt want to spend $80 on a calculatorthat hell be using or just ew eature, andhas no use ater those classes. Also, the

calculator hes using has a very complicatedmemory unction, and it only saves oneequation at a time. Reering back to theequation has been more troublesome,because he cant gure out what was theequation or.

Scenario:

Bobba has had a long, hectic day. He spent4 hrs in the Math lab doing his Calculushomework. Hes tired, and hungry. He getto the kitchen, and microwaves some o theletover pizzas. He gets back to his room,and opens his bagpack to check on hiscalculus homework. o his surprise he onlyound the rst two pages, and the rest weremissing. Tis could only be justied withone answer, He dumped the homeworkpapers along with the scratch works.

Hes in a panic mode now, he doesnt evenhave a calculator to do the homework. Telab is closed, and he has until tomorrowmorning at 9 to nish his work. He doesntwant to take a chance on waiting untilthe lab open in the morning. His onlyhope is to nd something online. He ndsout about the graphing calculator appon google, and downloads it, and starts

working on his problems.

Specication Contd.:


30/41

Design Process:Brainstroming


31/41

Design Process:Brainstroming


32/41

Design Process: Sketching


33/41

Design Process: Sketching Contd.


34/41

Design Process: Sketching


35/41

Prototype:

Home Screen o the calculator

Tis is how the rst screen will looklike, when the users open the app. Errormessages, and values will be displayed inthe small section below the input eld, toavoid any pop up error messages. Te valueisnt very important or the user so I triedto keep its size small. wo diferent types obuttons are used to help users identiy theirdiferences. Te numeric buttons are madecircular to create more space around them,

so that it ll be easy to hit. Te Done buttonchanges color once the user enters theequation to let them know that s the nextbutton to push.

Graph screen o the calculator

Tis is the most important screen in thecalculator. Users will get here once theyenter the equation, and hit the done buttonon the top right corner. Tis will let usersto look at the graph, zoom in, and zoomout. Also users can toggle around the savedequations. All the settings or the calculatorare provided in this screen, and are locatedat the bottom o the screen.


36/41

Design Elements:

Icons:

Tis is the library icon thatlllet users access the equationswhen clicked rom the homescreen, and the same icon willlet users add the equationsrom the notes to the library.

Tese are the apples standardon-o buttonIve used theseor the settings options.

Te round button thatll beused or the numbers, andalgebric expressions. Willchange color to light greywhen pushed.

Tis is the expression icon,this button can be ound atthe bottom o graph screen,

and it takes user back tothe home screen or anotherequation.

Tis rectangular buttonis used or trigonometricexpressions, and all o themcan be accessed by scrolling.Will change color to light greywhen pushed.

Tis is the standard rereshbutton used to bring thegraph screen back to center,once its zoomed in or out.

Tis is the standard iphonedelete icon that appears whenusers selete delete option romthe edit menu.

Tis is the settings, buttonwhich will take users to thesettings option where theycan change settings per theirpreerence.

Tis is apples standard selectbutton, that I used here inlibrary, and notes eature tolet people know theyre to beselected.

Tis is the notes icon which

will take users to the notesscreen where they can add,and edit notes, along withtheir equations.


37/41

Detailed Design:

Tis is the screen when the user start typingthe equations, they red description at the er-ror section will let the user know the correctorm o equation to be entered. Also oncethey start typing the done button on thetop right corner will change color to let theusers know that its the next button to pushto get to the graph. All the buttons changecolor once theyre pushed.

Tis is the screen when the users are donetyping, and the correct orm o equation isentered. Te value will be displayed in greenin a small screen below the the input eld.Te error, and value display had been placedin a small area, and color coded becauseusers do not like to interact with a pop upmessage, because its just one extra button topush, and it gets rustrating afer a while.


38/41

Detailed Design:

Tis is the screen when the user hits thedone button afer entering the equations.Tis is the graph or the entered equation.Te equation or which the graph is shownis displayed on the top right corner. Userscan toggle around it to go to another graphor another pre saved equation. All the nec-essary settings, required to get to the notes,and back to the equations are given in thisscreen.

Tis is the library page which can be ac-cessed rom both the home screen, and thenotes screen. Tis is the list o pre savedequations that user will be using requent-ly. Tis is made available so that they donthave to enter the equations over, and overagain. Also the users can add, delete, andupdate data rom the library anytime. Tebuttons will be highlighted when selected.


39/41

Detailed Design:

Tis is the notes page which lists all thenotes created by the users. Te plus sign atthe bottom will let them add a new note,and the date will appear automatically. Teycan edit, delete, and update notes anytimethey like. Te buttons will be highlightewhen selected.

Tis is the view o an opened notes screen,here you can see the equation on the top,the name o the equation belowit, the library

icon on the right side which will let usersto add the equation to the library, and thebottom section is or the description or thenotes, a standard iphone keyboard will popup when the text area is touched.


40/41

esting:

Introduction:

Tis calculator was created or the nonmath major students who have to take ewcalculus classes, and do not have muchuse or an expensive graphing calculator.Hence, the ideal participant or theprototype testing is someone non mathmajor whos taking calculus currently or hastaken previously. Tere are three participantin this test, and they were presented with aprint version o the product, and asked toidentiy the eatures.

Participant 1:22 years old. Single. Works at Linux Lab.Has be been using iPhone or ew years now.Was in Calculus class last semester.Computer Science major.Used Graphing calculator or the class.

Participant 2:24 years old. Married.Has been using iPhone or ew years now.ook Calculus I, ew semesters back.CI Major.Used Graphing calculator.

Participant 3:22 years old. Single.Has been using smart phones including iPhoneor ew years.ook Calculus classes.

Biology major.Used Graphing Calculator.C

Observation:

1. All the participants were able to identiythe buttons on home screen.2. Participants didnt recognize the

library button.3. Participants had trouble nding

equals button.4. Participant gures out notes button.5. All participants agreed that the plus

sign used to get back to home screenneeded to be changed to something else.

6. Participants were able recognize

notes icons.7. None o the participant asked about the

edit unctionality.8. Participants were conused with the

notes addition to the library.9. Participants had mixed views i they

are willing to use the calculator inuture. Tey said it d be easier to decidei it was a working prototype.

10. All the participant liked the design, andthe concept.

Reccomendation:

1. All the participants wanted the plussign to be changed to get back to home.

2. Participants wished the buttonswere bigger.

3. Participants wanted the library unctionto be more simple.

4. All the participants wanted 3D graph.5. All participants wanted a eature to

capture the image o graph to use itlater in homeworks.


41/41

Final Product:

Conclusion:

Te nal product looks proessional, andIm happy with it. However theres yet a loto testing to do. Te participant who testedthis calculator were excited, and gave mea positive eedback. Tey explained howtheyd use it i it were working, and ree.

Ater the testing I used the userrecommendations to increase the sizeo the round buttons. I got rid o all theunctions signs, and put them with thetrigonometric unctions. Tis created more

view, becasue none o my test participanthad used horizontal graphing calculator,and neither have I. Tis is the mainconstraint o this design.

Hence, I learned that there are manydiferent ways to solve a problem. Tememory unctionality was made better by

so many in the class, but each one did intheir own ways. I used the notes, and libraryunctions to solve the same problem.Tis is not a replacement or an actualgraphing calculator, and this is not or mathmajors. Te specic audience is non math

j b i l l l l l t d t

le calculator process book final

Documents