Lunch Money Buddy

lunch moneY BUDDY Process Report for Lunch Money Buddy: A Mobile Application for Parents and Students

Sara Tinnick

Kent State University UXD 61095-002: Interaction Design April - May 2018

Process Report

lunch moneY buddy

About this app Lunch Money Buddy was developed to help streamline the lunch-buying process. Parents can quickly add fund to their LMB account, ensuring their children always have enough funds to purchase a nutritious meal while at school.

"We want to keep our children healthy and happy."

- Samantha & Jorge, parents of Hailee and Brenden

2

Sara Tinnick - Kent State University

Table of contents

1. GOALS 4 2. PERSONA OVERVIEW

6

3. RESEARCH

9

4. SITE MAPS

12

5. PROCESS

16

6. FEATURES

25

3

Process Report

lunch moneY buddy

1. Goals 4

Sara Tinnick - Kent State University

Project Goals

User Goals

Download and sign up

Easy access to calendars and menus

Adding funds to the account

• Add multiple payment methods

• Select default payment method

• Modify payment methods

• Modify automatic payment options

Simple methods for adding funds

View account balance

Straightforward, clear navigation

Access menus for individual children

Easy to use

Quick access on mobile devices Low balance warning alerts

Access subsidy information Denote favorite lunches Close/delete account

5

Process Report

lunch moneY buddy

2.Persona Overview 6

Sara Tinnick - Kent State University

On-the-Go Parents Parents:

Samantha, 37 & Jorge, 34 Employment: Full Time Use of Technology: Advanced Mobile Adoption: Great Most Commonly Used Devices: Laptop & Mobile

Children:

While Samantha and Jorge are devoted, motivated, and ambitious in both the workplace and at home, their disorganization sometimes gets the better of them. As mobile adopters, they utilize online bill pay. They are definitely technology-savvy. But their digital habits often catch up to them as they lose the school’s lunch calendar. Seeking a digital solution, they often turn to the school’s website, but its disorganization frustrates them as well.

Hailee and Brenden are important to both parents, but the hectic lifestyle leaves them concerned about providing reliable lunch options.

No one in this family is a morning person, and sometimes preparing lunches leaves them rushed and stressed.

Samantha and Jorge want a mobile solution which allows for easy, onthe-go options for adding funds to their children’s lunch accounts. Low balance warnings would ensure the children always have funds, even if they forget to prepare their lunches. The children would love to be able to plan ahead, marking their favorite meals, so they do not miss them.

Hailee, 12 & Brenden, 8 7

Process Report

lunch moneY buddy

Managing Technology

Henry is like most typical retirees: he spends his time with friends, reading with his book club, and playing cards. While many retirees are enjoying the life of leisure, Henry is stressing over ensuring his grandson is receiving a healthy meal while at school. Henry was never a cook, and Joe buys his lunch every day. Henry worries he will forget to give Joe the proper amount each day for his meal.

A mobile application allowing him to check the balance of Joe’s account would be excellent, except for one problem: Henry is not comfortable with mobile apps. After several friends urged him to transition to digital books on his eReader and to purchase a smartphone, Henry is ready to learn in order know Joe is taken care of in school. Henry needs clear, easy to understand application with large text and simple navigation.

Guardian/Grandparent

Henry, 70 Employment: Retired Use of Technology: Novice Mobile Adoption: Some Most Commonly Used Devices: Desktop

Children:

Joe, 14 8

Sara Tinnick - Kent State University

3. Research 9

Process Report

lunch moneY buddy

Mobile App: Facebook

Familiar Faces

Horizontal scrolling carousel with graphics and information

While developing Lunch Money Buddy, it was important to give users something they are familiar with to reduce the learning time needed for use. According to Business Insider, in 2017 81% of mobile application users had the Facebook mobile application.

As of April 2018, there were 2.20 billion active Facebook users in the world, with 1.45 billion logging in daily. In the United States, 64% of users are over 25. This common usage creates patterns which can be utilized within other mobile applications.

Similar icons to aid feature recognition

10

Sara Tinnick - Kent State University

Mobile App: Huntington

Balance At-A-Glance Balance checking made simple

Due to the popularity of mobile banking, many users are becoming dependent on the technology employed by the applications deployed by financial institutions. Huntington Bank allows registered users who verify their identity via their settings page to view their balance just by launching the app.

This ease-of-use feature was incorporated into Lunch Money Buddy by placing the family’s current balance, next charge date, and next charge amount prominently on several pages.

Similar placement of navigation icons

11

Process Report

lunch moneY buddy

4.Site Maps 12

Sara Tinnick - Kent State University

Original Sketches

13

Process Report

lunch moneY buddy

Site Map Draft 1 Site Map: LUNCH MONEY BUDDY

PARENT/GuARDIAN LOGIN Login

Exit to OS Biometric Setup Answer Security Questions Choose Reset Destination

Username Password Stay Logged In Biometric Login Forgot Username Forgot Password

Sign Up 1 of 4 User Details First Name Last Name Email Password

2 of 4 Security Questions Question #1

3 of 4 Accept T&C Email Updates?

4 of 4 Enter School Access Code

Answer #1

Question #2 Answer #2

Confirm Password

Text Message Phone Call Email

Profile Setup PARENT/GUARDIAN CHILD Home Phone Cell Phone Name School Work Phone Home Address Grade Restrictions Email Address Payment Methods Allergies Likes Preferred Contact Method Schools Enrolled Dislikes Comments Add Additional Parent/Guardian YTD Costs YTD Costs Estimates After setup completion or Login Child Username Child Password

Enter Reset Code Enter New Password Confirm Password

CHILD LOGIN Exit to OS Biometric Setup

Username Password Stay Logged In Biometric Login

Funds Available Menu Today’s Meal Tomorrow’s Meal Upcoming (Wk)

Likes Dislikes Comments Send Parent Msg Notifications

Site Map: LUNCH MONEY BUDDY After setup completion or Login Notifications

Messages Compose From Schools From Children From LMB Users Search

Today’s Menu(s) Tmrw’s Menu(s)

Schedule Calendar Cost Likes Nut. Info Restrictions Allergies Alternative Offerings

Dislikes Health Tracker

School 1

Comments

School 2

Alerts Estimates Missed Meals

Menus

Funds

Calendars

Acct Settings

Help

All Menus Child 1 Child 2 Calendar View School View Filter View

Balance YTD Spending Estimates Add Funds

Weekly Daily Monthly Yearly Cost Likes Dislikes Restrictions Per Child Per School Family View

Username Password Add User Manage Users Children Notifications Payment History Update Info Edit Payments Close Account

Tutorials FAQ Help Beacons LMB Updates School Updates Feedback Contact School Contact LMB

Manage Pymt Methods

Date

Auto Pay Check Subsidy

Rating

Year End Options

Frequency Ordered

Child Likes

Refund Rollover

Dislikes Restrictions

Choose Method

Allergies

Prepay Amt Per Child Family Total

When a meal is clicked in any view

Meal Information Photo Description Likes Nutritional Information Dislikes Cost Add to Likes Comments Next Offering

14

Username Password

PayPal Amazon Pay

Credit Card # Expiration Date

Credit Card Bank Account

CSV Name on Card

Account #

Billing Address

Routing #

Choose Method Add Method Edit Method Select Default Delete Method

Verify Refund

LMB School Low Funds Likes

Address Email

Dislikes

Security Q’s Phone

Allergies/Restrict.

Updates

Email Chat Phone Forums Add Edit Names Schools Delete

Home Cell Work

Profile Setup New Code Delete

Sara Tinnick - Kent State University

Site Map Draft 2 Site Map: LUNCH MONEY BUDDY

PARENT/GuARDIAN LOGIN Login

Sign Up

Username Password Stay Logged In Biometric Login Forgot Username Forgot Password

Exit to OS Biometric Setup Answer Security Questions Choose Reset Destination

1 of 4 User Details First Name Last Name Email Password

2 of 4 Security Questions Question #1

3 of 4 Accept T&C Email Updates?

4 of 4 Enter School Access Code

Answer #1

Question #2 Answer #2

Confirm Password

Text Message Phone Call Email

Profile Setup PARENT/GUARDIAN CHILD Home Phone Cell Phone Name School Work Phone Home Address Grade Restrictions Email Address Payment Methods Allergies Likes Preferred Contact Method Schools Enrolled Dislikes Comments Add Additional Parent/Guardian YTD Costs YTD Costs Estimates After setup completion or Login Child Username Child Password

Enter Reset Code Enter New Password Confirm Password

CHILD LOGIN Funds Available Menu Today’s Meal Tomorrow’s Meal Upcoming (Wk)

Site Map: LUNCH MONEY BUDDY After setup completion or Login Notifications

Messages Compose From Schools From Children From LMB Users Search

Today’s Menu(s) Tmrw’s Menu(s)

Schedule Calendar Cost Likes Nut. Info Restrictions Allergies Alternative Offerings

Dislikes Health Tracker

School 1

Comments

School 2

Alerts Estimates Missed Meals

Menus

Funds

Calendars

Acct Settings

Help

All Menus Child 1 Child 2 Calendar View School View Filter View

Balance YTD Spending Estimates Add Funds

Weekly Daily Monthly Yearly Cost Likes Dislikes Restrictions Per Child Per School Family View

Username Password Add User Manage Users Children Notifications Payment History Update Info Edit Payments Close Account

Tutorials FAQ

Manage Pymt Methods

Date

Auto Pay Check Subsidy

Rating

Year End Options

Frequency Ordered

Child Likes

Refund Rollover

Dislikes Restrictions

Choose Method

Allergies

Prepay Amt Per Child Family Total

When a meal is clicked in any view

Meal Information Photo Description Likes Alert Information Dislikes Cost

Username Password

PayPal Amazon Pay

Credit Card # Expiration Date

Credit Card Bank Account

CSV Name on Card

Account #

Billing Address

Choose Method Add Method Edit Method Select Default Delete Method

LMB School Low Funds Likes

Address Email

Dislikes

Security Q’s Phone

Updates

LMB Updates School Updates Feedback Contact School Contact LMB

Verify Refund

Allergies/Restrict.

Likes Dislikes Comments Send Parent Msg

Add Edit Names Schools Delete

Profile Setup New Code Delete

Home Cell Work

Routing #

15

Process Report

lunch moneY buddy

5. Process 16

Sara Tinnick - Kent State University

Feedback Incorporation • Employing the proper biometric logins for Throughout the development process, feedback was given to refine the wireframes into the final prototype. device types

Specifically, the following areas were addressed:

• Refining forms to decrease the amount of information presented to the user

• Presenting critical information sooner

• Utilizing the email address as the username

• Refining the process to go back to previous

screens.

• Revisiting the navigation to reduce the amount

of information present on the main screen.

• Addition of a slide-in menu to allow users to access parts of the app from any screen, without returning to the main navigation screen.

17

Process Report

lunch moneY buddy

Refined Sketch 18

Sara Tinnick - Kent State University

Lunch Money Buddy

Student Main Screen

Notifications

FINAL PROTOTYPE made with

Wireframe

exported on 15/04/2018, 16:39

48/48

• Facebook-inspired carousel replaces Today’s Menu, Tomorrow’s Menu, and Menus Buttons • Notifications, Messages, and Settings buttons replaced with icons in the bottom tray • Slide out menu condenses multiple buttons • Help button replaced with a stationary icon in the top right corner • Funds-at-a-Glance provides critical information right away with an Add Funds button to streamline adding funds

19

Process Report

lunch moneY buddy

Lun

Annotated Sketch

mad

20

Sara Tinnick - Kent State University

nch Money Buddy

de with

Setup Complete/Confirmation

FINAL PROTOTYPE

Wireframe

exported on 15/04/2018, 16:39

14/48

21

Process Report

lunch moneY buddy

Refined Sketches

Initial Sketch

22

Lunch Money Buddy

Lunch Money Buddy Today/Tomorrow Menu

Lunch Money Buddy

School Menu Detail

Calendar: Weekly

Sara Tinnick - Kent State University

Lunch Money Buddy

made with

made withexported on 15/04/2018, 16:39

19/48

made withexported on 15/04/2018, 16:39

Today/Tomorrow Menu Horizontal

23/48

exported on 15/04/2018, 16:39

39/48

Wireframes 23

Process Report

lunch moneY buddy

FINAL PROTOTYPE 24

Sara Tinnick - Kent State University

6. Features 25

Process Report

lunch moneY buddy

Slide out menu to quickly access application features

Help readily available for those unfamiliar with the application interface

Add Funds button accessible from the home screen Funds available area provides quick access to critical information such as account balance, next payment date, next payment amount, year-todate spending, and estimated costs

Horizontal sliding carousel provides easy access to information

Confirmation screens certify actions have been completed and allow easy access to other features

Large, easy to read san-serif typography

Status bars indicate where the user is in a process

26

Sara Tinnick - Kent State University

Add one or more payment methods

Choose which method to use to add funds

Multiple payment options for every user

Set chosen method as default

Easily close LMB Account

Set chosen method as Autopay

Quick access to subsidy information

27

"I do my best to give my grandson a strong foundation" - Henry, Guardian of Joe