Claudia D'Adamo
Senior Seminar Project

Project Idea

For my senior seminar project, I decided to create an iPhone app. I would use data that my parents had about foods and the Blood Type Diet, and create a user interface that was more intuitive and efficient than the version of their app that they have already.

Tools:

  • XCode and Objective-C
  • Balsamiq
  • Pencil
  • Photoshop
  • Illustrator
  • Python

Goals:

  • Learn Objective-C
  • Practice wireframing and rapid prototyping
  • Create a user interface
  • Organize elements of my parents' app better
  • Understand the app-building process more
  • Practice parsing files with Python

Wireframing and Prototyping

Tools used:
Balsamiq
Evoluous Pencil
Photoshop
Illustrator

Initially I sketched out my user interface to see what I liked and didn't like. Then, I used tools such as Balsamiq and Pencil to create mockups on the computer. These helped me visualize my project and I was able to show these to my parents (as clients) and get feedback.


Sketches

Digital Mockups and Wireframing

Photoshop and Illustrator Editing








Data Collection and Parsing

Python Scripting

To see the entire script, click here

I wrote a python script to parse Excel files that my parents sent to me. This script read in multiple files (one for each blood type for foods, and then another four files for supplement information.) It then organized the data (after I had to get rid of non-UTF-8 encoded characters) into one plist per blood type. A plist is a file consisting of dictionaries within dictionaries for the app to read data from.

Here is what the final plist looks like. In Xcode, I could easily access data by key value pairs.

iOS Development

What I've accomplished:

I had never programmed in Objective-C before, so there was a large learning curve. The syntax is really different, but eventually I got more of the hang of it.

Design

One of the big things that I wanted to learn how to do was change the navigation bar colors, since that is an important part of my design. Luckily it only takes a few lines of code to change the Navigation bar image to one that I created myself. Depending on which blood type the user inputs, the backround image will be "type[A,B,AB,O]BackButton.png".

UIImage *image1 = [[UIImage imageNamed:@"typeABackButton.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 14, 0, 4)];

[[UIBarButtonItem appearance]setBackButtonBackgroundImage:image1 forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];



Two different options for home screen

Blood type icons

Each icon has foods on it that are beneficials for each blood type.

Type A: soy beans, spinach, lime, and salmon Type B: kidney beans, milk, beet, and pineapple Type AB: turkey, rice, oil, and broccoli Type O: bananas, cherries, beef, and ginger root

Functionality

I have three different sections, Food Lists, Products and Contact. Eventually I will add more sections, including Books and Tools (which will contain 4 Your Type Books and Blood Typing Kits).

Products

Products goes to the different product sections, and you can choose products in those sections. The product description page has a photo, description and a link to the page in Safari.



Food Lists - Beneficial and Avoids

Food lists leads to different food categories, and the user can choose the category and get a list of Beneficial and Avoid foods that are based on the blood type that they have chosen.





Contact

The Contact page goes to one view with information about how to contact North American Pharmacal, Inc. It includes the email and phone number, and a button to go to the website.