Xamarin Development Life Cycle: Taking an app from IA to Implementation

S E A M L E S S L Y B L E N D I N G C r e a t i v e & T e c h n o l o g y o n M o b i l e , T a b l e t a n d W E B

W W W . B L U E T U B E I N C . C O M

SEAMLESSLY BLENDING CREATIVE & TECHNICAL ON MOBILE TABLET & WEB WWW.BLUETUBEINC.COM 2

Mobile & Tablet applicationLife Cycle


Who is Bluetube• Mobile, Tablet & Web Enterprise

Integrator• User Experience & Design • Build and Integrate business

applications• B2B and B2C


Who AM I ?

• Grant Davies• CEO Bluetube • Mobile Evangelist

• Contact information• blog.bluetubeinteractive.com• [email protected]

http://blog.bluetubeinteractive.com/

Grant Davies

Bitly link here


Typical mobile lifecycle• Write down requirements• Look for standard components that

work• Code & STYLE TO FIT.


Better LIFECYCLE

APP Development

• User Experience• User Stories• Persona Mapping• Wireframes• Creative• Build

• Internal QA• User Acceptance Testing & Launch


User Experience• Users will have an experience• Its better if you plan that

experience• “Coding” with no UX / UI will result

in a unplanned / Random experience


Example Application• Co.Pilot

• Internal GPS for a Building• Employee Information• Offices, conference rooms, cafeteria• Mapping & Turn by turn directions• Pictures of floors to orient a user


User Stories• As a User I would like to search for an employee

and view their photo, email and phone number.• As a user I would like to view the location of an

employees cube• As A User I would like to be able to search for

conference rooms or offices and receive turn by turn directions

• As an administrator, I want to require users to be authorized to use the application


Personas

Persona mapping

• Employee• Jim Smith

• Wants to find a colleague, Jane smith• Wants to see where her cube is prior to going to see her

• Jane Smith• Has a meeting with Jim smith• Wants to see his picture so she recognizes him• Wants to see his phone number so she can call to tell him she’ll be 15 minutes late

• Administrator• Frank Blount

• Wants to be able to associate employees to cubes• Wants to be able to associate employees to pictures from the security system• Wants to require users to be authorized to install the app


Scope decisions• User stories

• Will be implemented in mobile app for IOS

• Administrator stories• Will be implemented manually

• Database & Enterprise MDM


ALL THE WIRES( THE BIG PICTURE)


Search for employee

User story

• As a User I would like to search for an employee and view their photo, email and phone number.


INFORMATION ARCHITECTURE(WIREFRAMES)


Changes

Changes from wireframes

• Navigation icons too big• “instructions” tool tips were made more

“cartoon” for clarity• More categories in results• Make phone number a button• Make email a button• Lookup by floor and cube


Creative DESIGN


Changes

Change from creative design

• Make NAV icons stand out more• Remove search button and

“delete” in search box• Change name font and department

font, so name stands out.


The APP


PSD -> App

How do we get to the app ?

• Developers have photoshop• Cut the images/backgrounds from

Photoshop• Create a set of “resources” for the

app


Read our blog

• We will post the presentations to our blog

short link – bit.ly/10HUE9t

blog.bluetubeinteractive.com

http://blog.bluetubeinteractive.com/


Thank you

QUESTIONS ?

Technology

Xamarin Development Life Cycle: Taking an app from IA to Implementation