Quick Mechanic App Digital Prototype (05/07/14)

Quick Mechanic App became a digital prototype today.

It now really looks like something and I am very happy with it. I know that this is an app that I would use myself and I think so would so many more people.

I picked the UI design that I thought worked best. It has the best functions for a tablet app. Taking this UI design I designed the rest of the pages that I had planned out for the app. I then uploaded onto the InVisionapp website. I found InVision to be simple and easy to use while making the presentation look polished.

Before deciding on using InVision for this app I decided to do some research. I made a definite choice InVisionApp after reading Jeremy Wells, blog “7 Reasons Why I Use InVision for Rapid Prototyping” in Web Design Technique. Wells explained that InVision is a prototyping tool created for designers by designers. He wrote that it allows for quick and easy prototype mock ups and as a creative director he has found this took indispensable. The beauty with InVision is that mockups can be discussed among collaborators right inside the app.

Wells reasons for liking and for using InVision went like this:

1. Presentation-InVision is a far better way to show the client the prototype.

2. Control of Your Designs-It presents in a way that mimics an actual web browsing experience. This enables the designer to control how the user see the design.

3. Real Time to Do-List-All progress start to finish happens inside the InVision App. This makes the give and take of feedback easy, simple and immediate. It at the same time can create a to-do list that can be crossed off as they are completed.

4. Mobile- InVision allows for mobile prototyping using all of its gestures such as swiping etc.

This makes it easier to visualize the mobile app.

5. Version History and Syncing- InVision will keep record of all the past screens used. The InVision Sync app makes adding screens simpler and makes it easier to access.

6. Hover States- InVision makes prototypes interactive and more realistic by enabling the designer to create menus, tooltips and hover states for buttons.

7. Live Share! This allows the collaborators in real-time, using an in-browser screen to share. Each collaborator is able to use their own mouse and sketch and chat right inside the Live Share Interface.

I agree with Jeremy Wells, InVision was a great tool for me to use.

Works Cited

Wells, Jeremy. “7 Reasons Why I Use InVision for Rapid Prototype.” Web Design Technique. N.p., 14 Feb. 2014. Web. 5 May 2014.

Quick Mechanic Paper Prototype (04/30/14)

While I was home this weekend I asked my father to test my Quick Mechanic App using the paper prototype I made. After a few technical difficulties-ran out of memory on camera and the camera was not compatible with my Mac, we got it done. The good news about the technical difficulties was that it  showed me some things that needed to be changed.

In Order to be sure that I reached my goals I wanted a list of questions to ask myself. I came across Atlassian Blogs, “Usability Testing with Paper Prototypes”. Richard Dunmayer and Gert Jan Bartelds, members of Testnet, the Dutch software tester’s association, wrote a guest blog.

Using the questions they provided in the blog, I did my test and recorded my results.

1. Are the end users doing what I want them to do?

Yes, the user did exactly what I wanted.

2. Are they doing what I expected them to do?

  They did not do  what I expected at first. I made some changes and improved the flow.

3. Did they become confused while trying to reach their goals?

No, he did not seem confused, and was able to reach his goal.

4. Did I really think through all possible paths through the application?

After one of the run throughs I recognized that some paths needed to be added. Once added, I believe the application has all the possible paths.

5. Did they have a preferred path?

The user did not have a preferred path. The application can be used in several ways and he seemed comfotable with all of them.

6. Are some paths unused?

All the paths were used.

7. Are some paths used in ways that weren’t intended?

After the modifications I  believe all the paths were used in the way in which I intended.

I think my test went well. I have posted it to YouTube.

Works Cited

Dunmayer, Richard, and Gert Jan Bartelds. “Usability Testing with Paper Prototypes.” Atlassian Blogs. N.p., 30 Nov. 2011. Web. 27 Apr. 2014. <http://blogs.atlassian.com/2011/11/usability-testing-with-paper-prototyping

Quick Mechanic UI Design (04/23/14)

Quick Mechanic App is coming along. The more I do it the more ideas I am getting. I keep thinking of my own car. It seems like everyday I find something needs to be fixed. Recently the light bulb for the blinker burnt out. It turns out that it is a relatively easy thing to fix yourself. That is one of the items that  I would have used the Quick Mechanic App for.

I revamped the IA and the wireframes. The nice thing about a tablet app vs a mobile app is that there is more room for graphics and for text. I decided that graphics of various car issues could be used. I think they make it easier for the viewer to identify the specific car problem.  Once the car issue is selected, a series of questions follow until the app finds the solution.

I like silver and maroon as my color scheme. I think they present an auto repair garage kind of feel.

  

  

What I had to keep in mind was the difference between designing a mobile apps, tablet apps and website applications. Part of my process before I start,  is to read. Reading articles and blogs helps me stay on target and to visualize what I want to achieve.

Although these articles did not change my designs, I did find them informative.  I came across the Android Design in Action on YouTube on “Responsive Design”, and found it interesting. With all the different platforms and sizes, designing for scale has become hugely variable. Ethan Marcole coined the name Responsive Design. He says responsive designs will “make them not only more flexible, but more adaptive to the media that renders them.” On Monday Gears and Gadgets had an article “Google’s Next Design Challenge: Unifying App Design Across Platforms”. This article is reporting on a rumor that Google is working on the project Google 2. It wants a single app design that is able to scale across iOS, Androids and wearables to desktops. It makes sense for the next step of apps, with so many different platforms on the market.

We will soon see if rumor is true.

Works Cited

gears and gadgets. ars technica, 21 Apr. 2014. Web. 22 Apr. 2014. <http://arstechnica.com/gadgets/2014/04/googles-next-design-challenge-unify-app-design-across-platforms/>.

Responsive Design. YouTube. Android Design in Action, 9 Oct. 2012. Web. 19 Apr. 2014.

Info Arch and Wireframes (04/16/14)

I redid the personas for Quick Mechanic App.

I took myself out and substituted a persona named Luke. I included  more information to him and to my original persona Kelly than I had in my first set of personas. I developed these personas with the idea of them being likely users for the Quick Mechanic. I think these personas are much stronger and will be a better aide for me to use as a begin to design the IA’s and the wireframes.

Before I got to doing the IA and wireframes I did some reading on designing tablet apps. In the UXmatters colume “Designing Tablet Apps” columist Steven Hoober wrote,

“You need to think about how people use tablets. They aren’t little computers or big phones, but a different class of device. People use tablets when performing other tasks, slouching on the couch, or watching TV. They use them a lot more at home than their mobile handsets.”

I pictured users using Quick Mechanic, as they sat on their couch or in their bed. I also can picture more than one person looking at the app at the same time-discussing what may be wrong with their car.

I also read the UXmatters colume, Adopting a Professional Compass for Information Archetecture.  Nathaniel Davis uses a sort of acryonym to explain the compass he uses when developing his information archetecture. “Simplify How People Navigate and Use Information that Connects to the Web.”

1. Focus on Simplicity

2. Explore How to organize and create useful relationships between information

3. Users are People first

4. Navigate: provide the primary pathways to information

5. Make information Useable

6. Master the way people Connect to the Web

With this in mind I developed my IA and then my wireframes.

Works Cited

Davis, Nathaniel. "Adopting a Professional Compass for Informational Architecture." uxmatters. N.p.,11 Feb. 2014. Web. 12 Apr. 2014. <http://uxmatters,com/mt/archives/2014/02/ adopting-professional-compass-informational-architecture>.

"Designing Tablet Apps." Ask UXmatters. UXmatters, 21 Jan. 2013. Web. 12 Apr. 2014.

   <http://uxmatters.com/mt/archives/2013/01/designing-tablet-apps>.

Quick Mechanic App Personas (04/09/14)

This  week I created personas for my Quick Mechanic tablet app. Before I began I went back into course materials and found the Persona project assignment sheet from this semester’s first week. I began to re-read the research sources to get a feel for what, why and how I should go about creating personas.

From Jeff Sauro I was reminded of the why. He wrote in his Measuring Usability Blog, “Personas are an archetypical user of a system, an example of the type of person who would interact with it.” He emphasised that although the persona is fictional it provides a real benefit. Sauro wrote that he was first introduced to personas in the 1990’s from Alan Cooper’s book The Inmates are Running the Asylum. I thought it was interesting that this process has been around for at least 20 years.

From there I combined ideas from the ux-lady and the The UX Review. The ux-lady approached creating personas with a recipe formula. It was easy to follow, and provided a format to plug in information. The UX Review also made sense of making the personas, with easy steps. The advice they provided was not to over do it. The persona should not be terribly in depth and minutiae details should be omitted.

The steps of how to create the person from the ux review:

1. Person’s goals

2. Person’s motivation for using

3. Person’ current pain points

4. Demographic data (age/location/sex)

5. A quote to capture their attributes

6. Short bio

7. Person’s technical ability/ devices they use

Combining the ux-lady and the steps from the UX Review I began to create my personas.

It was easy to use myself as a persona. When I developed my idea of the Quick Mechanic App I did it with myself in mind. I have an older car that I inherited from my grandfather and I know that this app would be something that I could use. Living in Hamden I do not have access to a mechanic that I know like I do at home. I also think there are a lot of people, especially people my age who would be interested or have a need for such an app.

My second persona I had to put more thought into. I wanted to show that the app is really appropriate and useful to all types of people. I wanted a totally different demographic. I came up with a middle age mother, who had concerns for her family driving a car. I think she would be likely to look something up on the app if she had a question about her car or the car her children were driving.

Works Cited

“DIY User Persona.” ux lady. N.p., 28 June 2013. Web. 6 Apr. 2014. <http://ux-lady.com/diy-user-personas>.

Mears, Chris. “Personas-The Beginner’s Guide.” The UX Review. N.p., 22 Mar. 2013. Web. 6 Apr. 2014. <http://theuxreview.co.uk/personas-the beginners-guide>.

Sauro, Jeff. “7 Core Ideas About Personas and the User Experience.” Measuring Usability. N.p., 31 July 2012. Web. 6 Apr. 2014. <http://measuringusability.com/blog/personas-ux.php>.

Quick Mechanic App (04/02/14)

This app is for someone who has car trouble and has no experience with mechanics. Could be a 16 year old who just got his license or an old woman who has been driving for years, and everyone in between. This app has a very wide market.

Functions:

When car has issues you pull out your tablet and go to the app. There you will see some examples of problems. Such problems would include, "Red light on dashboard and I don’t know what it means," "Flat tire," "Brakes don't feel right," "Car making a funny noise," "Car is making a funny noise," etc. Once you pick one, a flowchart will be displayed to you for the different options of how to fix the problem. For example, if you picked "Car won't start," there will be a flow chart with questions such as, " Does it turn over, yes or no?" And below that will be options for both yes and no. Or if you pick, "Car is making a funny noise," you'll get, "What kind of sound," "Does it only do it when it's moving," and "Does it change with how fast you're going?"

There will also be a GPS to determine your location and find you a nearby garage. This way, if you don't have the tools or skills to fix your car yourself, you can locate your local garage and they'll fix it for you. You can also tell them what exactly is wrong with it according to the app, and save them the trouble of finding out themselves.

Research:
Michael was driving down the highway when suddenly his car was making a strange clunking sound. He doesn't know what's causing it, he had no one to call that could tell him and he didn't know where any nearby garages are. This app would have helped him find out what the problem was and where he could have gone to fix it.

John had a flat tire and didn't have a spare or knew where he could find one. This app would have helped him find a place to change tires and even got a spare one.

Digital Prototype Redo (03/26/14)

I redid my digital Prototype for the New York Tides App

Tablet App Ideas (03/26/14)

So with keeping the criteria in my last post in mind, I got back to brainstorming.

• Ask a Mechanic App that gives instructions on how to fix car problems that you type in. If you decide you can not fix it yourself it will link you to a local garage. My reasoning for this app is that there are some cases where a person with little to no knowledge of cars can fix a simple problem on their own. By typing in your car problem a video of a mechanic will answer your question and or will show you how to fix the car yourself. They can show how to change oil or a tire or spark plugs etc. Some car problems are large and require immediate attention. Recommendations can be made to where to find a reputable mechanic in your area. Reviews of the Mechanic can be viewed on the app. Rough idea of pricing can give the user an idea of what is an reasonable price of the repair. Many people have no idea what repairs should cost. This aspect of the app can save people money.  In the cases of a broken down car an app would be good to give the name and telephone number of the nearest repair station or towing company.

In my research of apps I found that they were some very similar mechanic apps to this. However I do not see that they do quite what I am designing. I did not find an app where a user could type a question and a video would answer and demonstrate how to do the repair, and make recommendations for pricing as well as repair garages.

Similar Apps:

Repair Pal app is an example of giving pricing for car repairs and mechanic recommendations.

iFixit: Repair Manual is an app with the largest repair manual with DIY guides.

Ask a Doctor- is a similar idea to Ask a Mechanic

• QU Shuttles schedule-This app will tell you exactly what time and where the next shuttle will be picking up and arriving at locations. Right now this information is on the quick links on the QU website. A quick look at this app will save the user from having to navigate through the website. This could also be made as a widget. This is a great app for QU students that rely on the shuttle to take them to Hamden and New Haven.  According the the Quinnipiac University website there is approximate 6200 undergraduates at Quinnipiac with 4000 living on campus. Taking the shuttle to shop in Hamden or to go out in New Haven many students rely on the 12 shuttles.  This app will make looking up shuttle schedule easier and will provide valuable information.

In my research I have found that there is an app for Quinnipiac but surprisingly to me, there shuttle schedule is not included in it.

Some apps to get inspiration from could be:

Amtrak

• 3 dice and your out game- This is a game I designed in one of the GDD classes I took. It a simple version of baseball using the roll of dice. It is a quick and easy game that requires a basic knowledge of baseball. It is a simple enough that you can multitask while playing which I believe will appeal to many. With the dice and the baseball theme it will be reminiscent of childhood games. Variations can be made to the game to make different and more challenging levels.

My research shows that games such as Candy Crush is very popular and is making a lot of money. Candy Crush is scheduled to become a publicly traded stock. The appeal to candy crush besides the simplicity is that it “taps into the inner child.” The board is very similar to the game Candy Land and appeals to people of all ages. It has in particular appealed to women.

Works Cited

Dockterman, Eliana. “Candy Crush Saga The Science Behind Our Addiction.” Time: n. pag. TIME. Web. 23 Mar. 2014. <http://business.time.com/2013/11/15 candy-crush-saga-science-behind-our-addiction>.

• Adobe Creative Cloud for tablet-This would be great for tablet or smartphone to be able to create some creative pieces while being mobile. I have not found this app or any one like it. This would appeal to many designers who visit clients. The tablet is an easier device to carry and to travel with.

In researching I have not found any apps that seem to be in any way similar.