Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software...
Transcript of Agile for Mobile App Development - Home - Synerzip · Synerzip in a Nut-shell 1. Software...
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
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
Hyper-Prototyping
© www.synerzip.com / www.threebeacons.com 2010
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
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
Hyper-Prototyping – “iTalk to God” iPhone app
7© www.synerzip.com / www.threebeacons.com 2010
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
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
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
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
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
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
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
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
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
Community Code
Scrounging
© www.synerzip.com / www.threebeacons.com 2010
“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
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
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
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
Example – Facebook Integration
22
• FB integration to existing app “My Personal Motivator”
© www.synerzip.com / www.threebeacons.com 2010
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];
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
User Design Studio
© www.synerzip.com / www.threebeacons.com 2010
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
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
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
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
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
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
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
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
User Design Studio - technique
34
Working Lunch
• More open discussions
© www.synerzip.com / www.threebeacons.com 2010
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
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
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
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
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
Synerzip Clients
40© www.synerzip.com / www.threebeacons.com 2010
Thank You!
www.threebeacons.com
Michael Hall
214.783.3936
www.synerzip.com
Hemant Elhence
469.322.0349
Agile Software Product Development Partner
Call Us for a Free Consultation!
41© www.synerzip.com / www.threebeacons.com 2010
THE END
Michael Hall
Three Beacons
214.783.3936
© www.synerzip.com / www.threebeacons.com 2010