Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software...

42
Michael Hall Three Beacons [email protected] 214.783.3936 Agile for Mobile App Development

Transcript of Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software...

Page 1: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Michael Hall

Three Beacons

[email protected]

214.783.3936

Agile for

Mobile App Development

Page 2: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Well Known Agile Techniques

2

• Short iterations

• Engaged customer

• Iteration planning – one at a time

• Release planning - based on team velocity

• Prioritized backlog

• User stories

• Burndown charts

• Test-driven development

• Continuous integration

© www.synerzip.com / www.threebeacons.com 2010

Page 3: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

3 Techniques for Mobile App Development

3

1. Hyper–Prototyping

2. Community Code Scrounging

3. User Design Studio

© www.synerzip.com / www.threebeacons.com 2010

Page 4: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping

© www.synerzip.com / www.threebeacons.com 2010

Page 5: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping

5

Rapid Prototyping

• Create pieces of the software system

• Unofficial solutions

• To obtain feedback

• To prove merit of solution approach

• Typically big chunks of functionality

Hyper-Prototyping: Rapid Prototyping on steroids!

© www.synerzip.com / www.threebeacons.com 2010

Page 6: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping

6

Hyper-Prototyping

• Similar goals as Rapid prototyping

• Much faster, tighter feedback loops, heavy

collaboration

• Often 5 – 10 times per day

• As a solution attempt is made, team huddles to

review and discuss

- Whoever is available

- Software team, PM, customer proxy, marketing, etc.

• Especially useful in UI and app behavior efforts

© www.synerzip.com / www.threebeacons.com 2010

Page 7: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – “iTalk to God” iPhone app

7© www.synerzip.com / www.threebeacons.com 2010

Page 8: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping - example

8

UI design challenge:

• Add “favorites” capability- user designates verse as a favorite

• Add “email share” capability- user emails verse to a friend

iPhone Nav Bar

iPhone Tab Bar

© www.synerzip.com / www.threebeacons.com 2010

Page 9: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 1

9

Feedback: envelope flies in when user advances to next verse, some verse/comments require

scrollable screen but star does not scroll with the text, star must be re-positioned based on

verse length, etc.

Email envelope in Nav Bar, Favorites star near verse reference

(Designated favorite)

© www.synerzip.com / www.threebeacons.com 2010

Page 10: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 2

10

Feedback: too crowded at top, difficult to see, looks unbalanced.

Email envelope and Favorites star at top before verse

© www.synerzip.com / www.threebeacons.com 2010

Page 11: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 3

11

Feedback: better, but buttons look odd at top.

Re-position start of verse to reduce crowd

© www.synerzip.com / www.threebeacons.com 2010

Page 12: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 4

12

Feedback: too crowded at bottom, violates iPhone Tab Bar purpose for context switching

only.

Integrate Email envelope and Favorites star within bottom Tab Bar

© www.synerzip.com / www.threebeacons.com 2010

Page 13: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 5

13

Feedback: takes too much extra space, 2 icons on top of 2 icons looks a little odd. Is there

really a need for the bottom Tab Bar at the verse level? No.

New Tool Bar at bottom

© www.synerzip.com / www.threebeacons.com 2010

Page 14: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping – hyper 6

14

Feedback: bottom Tool Bar balances the top Nav bar very well. Good balance on new Tool

Bar icons. Icons are intuitive.

Remove iPhone tab bar, add new Tool Bar at bottom using same style as top

Nav Bar, use hollow icons for dark background

© www.synerzip.com / www.threebeacons.com 2010

Page 15: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Hyper-Prototyping - results

15

Final solution

Hyper-prototyping result:• 6 fast iterations

• Updated UI design and code

• Highly collaborative

• Intuitive user solution

• Duration: less than 1 day!

© www.synerzip.com / www.threebeacons.com 2010

Page 16: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Introspective Challenge

16

• How long are your prototype loops?

• Could they be shorter?

• Are you leveraging collaboration to

find the best solution early?

• Do you tend to accept a subject

matter expert’s design without

constructive challenge?

© www.synerzip.com / www.threebeacons.com 2010

Page 17: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Community Code

Scrounging

© www.synerzip.com / www.threebeacons.com 2010

Page 18: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

“Scrounge” definition

18

Scrounge

intransitive verb

“to search about and turn up something needed

from whatever source is available …”

- www.webster.com

© www.synerzip.com / www.threebeacons.com 2010

Page 19: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Community Code Scrounging

19

• Worldwide “community” of software

developers on Internet

• Code examples

• Code solutions

• New patterns

• New learning paradigm

• New development paradigm!

© www.synerzip.com / www.threebeacons.com 2010

Page 20: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Recent Examples

20

• iPhone: Facebook integration

• Objective-C : how to append to a

string

• Android: handling different display

sizes

© www.synerzip.com / www.threebeacons.com 2010

Page 21: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Recent Examples

21

• iPhone API: how to center text

within a rectangle

• Windows Mobile: scrollable list

with background

• Objective-C: how to display an

image from a file

© www.synerzip.com / www.threebeacons.com 2010

Page 22: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Example – Facebook Integration

22

• FB integration to existing app “My Personal Motivator”

© www.synerzip.com / www.threebeacons.com 2010

Page 23: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Example – Facebook Integration

23© www.synerzip.com / www.threebeacons.com 2010

Facebook Objective-C API code

Scrounged “helper classes”

“My Personal Motivator” source code-(IBAction)callStatusUpdate:(id)sender

{

// call FBPostStatus method of

FaceBookStatusUpdate class

DrillDownAppAppDelegate *AppDelegate =

(DrillDownAppAppDelegate *)[[UIApplication sharedApplication]

delegate];

[AppDelegate.statusHelper FBPostStatus];

}

-(void)designateOrUndesignateAsFavorite:(id)sender

{

DrillDownAppAppDelegate *AppDelegate =

(DrillDownAppAppDelegate *)[[UIApplication sharedApplication]

delegate];

// code to flag the verse as favorite or not favorite

int i;

int currentVerseAlreadyAFavorite = 0;

NSInteger locationOfUndesignatedComment = 0;

for ( i = 0; i < [AppDelegate.arrayOfFavoriteItemThree

count];i++)

{

tempStoreOfArrayVerse =

[AppDelegate.arrayOfFavoriteItemOne objectAtIndex:i];

tempStoreOfArrayVerseReference =

[AppDelegate.arrayOfFavoriteItemTwo objectAtIndex:i];

tempStoreOfArrayVerseComment =

[AppDelegate.arrayOfFavoriteItemThree objectAtIndex:i];

Page 24: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Warnings

24

• Scrounged code may have problems!

Run-time exceptions

Memory leaks

Poorly written

• Ownership – make it yours!

• Fit it into your coding standards

Alignment, style

Naming conventions, etc.

• Fit it into your quality plan

Zero memory leaks

Code reviewed, etc.

© www.synerzip.com / www.threebeacons.com 2010

Page 25: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio

© www.synerzip.com / www.threebeacons.com 2010

Page 26: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Interface – challenges

26

UI Challenges in Agile

• Compressed schedules

• Short iterative cycles

• Multiple team members

• Disparate ideas and visions

How to establish UI vision quickly and early?

© www.synerzip.com / www.threebeacons.com 2010

Page 27: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - background

27

• Agile 2008 and 2009

presentations

- Jeff White, Amazon

- Jim Unger, Jewelry TV

- Todd Warfel, Messagefirst

• Agile User-Centered

Design

• Analogy: art studio- People come in and

critique the work

- Positive and constructive

Any product UI – web page, smart phone, PC utility, etc.

© www.synerzip.com / www.threebeacons.com 2010

Page 28: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - goal

28

• 1 day effort

• Collectively and collaboratively

establish the UI design!

• Deliverable – initial UI design

Q: how does your team currently obtain the UI design?

© www.synerzip.com / www.threebeacons.com 2010

Page 29: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - technique

29

• Present ideas

• Then, critique …

• Then, discuss alternatives …

• Then, make decisions.

Decisions are team-based, “wisdom of the crowd”

© www.synerzip.com / www.threebeacons.com 2010

Page 30: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - prep

30

Prep work:

• Obtain vision or list of high-level

features from customer

• Ask for volunteers for design

studio session

• Mock up some design ideas

(if possible)

• Interview end users

(if possible)

© www.synerzip.com / www.threebeacons.com 2010

Page 31: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - announcement

31

• UI team lead announces Design Studio

• Invites 4 – 10 people

• Engineers, QA, PMs, stakeholders, creative thinkers, etc.

• Identifies session facilitator

© www.synerzip.com / www.threebeacons.com 2010

Page 32: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio – technique (AM Session)

32

AM session

• PM discusses project vision

• PM hands out vision statement and/or

2 or 3 user scenarios for review

• Questions, discussion

• Each team member works individually - Draws their best attempt at a set of UI

screens

- Big sheets of paper, lots of pencils with

erasers

- Develop as many screen alternatives as

time permits

© www.synerzip.com / www.threebeacons.com 2010

Page 33: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio – technique (AM Session cont)

33

• Each team member presents one at a time

- Round-robin fashion

- “This is my initial thinking. I’m open to your suggestions.”

- Facilitator

Insures all ideas are considered

Tracks GOOD ideas and CONS

Insures positive experience

- If time, cycle back for alternatives

© www.synerzip.com / www.threebeacons.com 2010

Page 34: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - technique

34

Working Lunch

• More open discussions

© www.synerzip.com / www.threebeacons.com 2010

Page 35: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - technique

35

PM session

• Team collaborates

- Creates a new UI design

- Take all GOOD ideas that mesh well

- Park others

• Refine / Repeat

• UI team lead decides on impasse

• 4:00PM dialog- Team presents vision and screen mocks to

stakeholders

- Takes feedback and reacts

• Project is off and running, coding begins!

© www.synerzip.com / www.threebeacons.com 2010

Page 36: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

User Design Studio - benefits

36

• Benefits

• Rapid exploration of design alternatives

• UI development can begin immediately!

• Unified understanding and ownership of

design vision

• Collaboration of all good ideas

• Identification of not-so-good ideas and why

• Team building

• Builds trust

• Energizes team

© www.synerzip.com / www.threebeacons.com 2010

Page 37: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Introspective Challenge

37

• How do you develop UI designs?

• Is it as collaborative as it could be?

• Do you rely on “subject matter

experts”?

• Would you agree that crowd wisdom

can actually help subject matter

expertise?

• When is your initial UI vision ready?

• Do you need improved team morale?

© www.synerzip.com / www.threebeacons.com 2010

Page 38: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Questions?

www.threebeacons.com

Short/Long term Agile coaching

Agile Methods training:Mar 25 - 26: Intro to Agile & Scrum (Dallas)

Scrum Team Training

User Stories

Product Owner

All courses can be delivered onsite at your location

Michael Hall, [email protected]

214.783.3936

www.synerzip.com

Hemant Elhence, [email protected]

469.322.0349

Agile Software Product Development Partner

38© www.synerzip.com / www.threebeacons.com 2010

Page 39: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Synerzip in a Nut-shell

1. Software development partner for small/mid-sized technology companies

Exclusive focus on small/mid-sized technology companies

By definition, all Synerzip work is the IP of its respective clients

Deep experience in full SDLC – design, dev, QA/testing, deployment

Technology and industry domain agnostic

2. Dedicated team of high caliber software professionals Seamlessly extends client’s local team, offering full transparency

NOT just “staff augmentation”, but provide full mgmt support

3. Actually reduces risk of development/delivery Experienced team - uses appropriate level of engineering discipline

Practices Agile development – responsive, yet disciplined

4. Reduces cost – dual-shore team, 50% cost advantage

5. Offers long term flexibility – allows (facilitates) taking offshore team captive – aka “BOT” option

39© www.synerzip.com / www.threebeacons.com 2010

Page 41: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

Thank You!

www.threebeacons.com

Michael Hall

[email protected]

214.783.3936

www.synerzip.com

Hemant Elhence

[email protected]

469.322.0349

Agile Software Product Development Partner

Call Us for a Free Consultation!

41© www.synerzip.com / www.threebeacons.com 2010

Page 42: Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software development partner for small/mid-sized technology companies Exclusive focus on small/mid-sized

THE END

Michael Hall

Three Beacons

[email protected]

214.783.3936

© www.synerzip.com / www.threebeacons.com 2010