Hacking with Edge
+ WICS, Women in Information and Computer Science
First, let’s meet each other
Your Name and add
up to 2 words to the
story
Hmmm…what just happened?
HACKATHONS - FUD
* Question snippets from Quora.com
What’s in a hackathon?
if (Hackathon.equals("SCARY")){
readReality();
}
private void readReality(){
System.out.println("Fun and relaxed events");
System.out.println("Meet a lot of like minded people");
System.out.println("Passion to learn and create solutions");
System.out.println("Don’t have to be a genius / coding pro");
System.out.println("SWAG!");
System.out.println("Career Opportunities");
}
Expressing your idea (or
solution) through code
It’s all interactive this afternoon!
How do you organize? Setting up your Dream Team
How do you work together? Managing the dynamics and making decisions
How do you express your idea or solution quickly? Prototyping
hackathon - DREAM TEAM
Form a team of 4 with the following roles. (If the group is small, stick with 3
members)
In your team, call out your skillsets and identify team members with similar roles
Ensure your group consists of
# Hustler…Hustler and Visionary (2)
# Hipster…the Designer
# Hacker
(1) HUSTLER
(2) Visionary
Hustler and Visionary - You don’t need to be a
marketing guru or a COO
Visionary
# Are the business savvy ones
# Find product - market fit & sell the product
Hustler
# Ensure timely goals are met during the course of the
hackathon
#Can put together a plan and move the team along
#Find cheap or free resources to help your team
HACKER
The Hacker - brings their utility belt of
technological solutions
# Learn a javascript framework - React, Backbone,
Angular
# Stub data - Build a facade and not an engine
Stub data in fixtures (JSON files), simple google
fusion tables, or a very simple backend using
something like Firebase, CouchDB
#Hacker - You Don’t have to be a coding pro
Many teams have more than 1 hacker…if you have “mad” front end skills, you can bootstrap the
backend for a hackathon. If you have awesome backend skills, work with your hipster/designer to
figure out how you can integrate what you coded with a front end experience
Commonly used APIs
Communications & Social APIs - Twillo, SendGrid, Facebook, Twitter, Reddit, Instagram, Google+
Geo APIs - Google Maps, Google places, Yelp, MapBox, Uber API
Payment related APIs - Venmo, Paypal, Stripe
Music APIs - Spotify, EchoNest, Google Play, SoundCloud
* More examples on http://studenthackers.devpost.com/#rankings
HIPSTER
(Designer)
#Hipster - you don’t have to be an artist
# Think through the flows of a customer
interaction
# Prototype quickly and iterate to refine
your team’s solution
# Use Dribbble, Behance, pttrns.com for
inspiration
Got your team? Each person has a role?
Now, let’s solve a potential hackathon
problem
The Customer Problem
Jane is late for the 4th time this quarter
and it’s only 6 weeks in. Her professors
are threatening to drop her from the
course if she doesn’t start arriving on
time. Jane struggles finding parking
and can’t leave earlier because she
works part-time at a local Bagel Shop
called Lox and Bagel. Her manager
won’t let her leave early because it’s
the busy time in the morning and there
are a lot new employees that are still
training
Create a solution that can help
Jane find parking quickly
within her tight schedule?
Consideration: What data
points would we collect to help
her timing and parking
problem?
The Challenge: 24 hours
In your teams, break up the work
and come with a plan to solve the
problem within 24 hour period
!
Share Out: What was easy to do?
What was hard to do?
Fast Path I
20
Intuit - Confidential
……………………………………………………………...
GRPI
Goals: Desired Outcomes/Great Experience/Needs of Sponsor
Roles: Facilitator, Scribe, Timekeeper, Etc.
Process: Agenda and Timeline
Interpersonal: Ground Rules, Guidelines…
• How we want to behave individually and as a team
• How we want to communicate
• What will be a great experience interpersonally
Start here
The Customer Problem
Jane is late for the 4th time this quarter
and it’s only 6 weeks in. Her professors
are threatening to drop her from the
course if she doesn’t start arriving on
time. Jane struggles finding parking
and can’t leave earlier because she
works part-time at a local Bagel Shop
called Lox and Bagel. Her manager
won’t let her leave early because it’s
the busy time in the morning and there
are a lot new employees that are still
training
Create a solution that can help
Jane find parking quickly
within her tight schedule?
Consideration: What data
points would we collect to help
her timing and parking
problem?
The Challenge: 24 hours
In your teams, break up the work
and come with a plan to solve the
problem within 24 hour period
!
Revisit the task using GRPI Framework…
Share Out: What other situations
would this be helpful to use?
Making Decisions
It’s the last 5 hours of the hackathon and your team came up
with two different solutions.
Scenario:
The "team" came up with two solutions and they need to
decide which one to move forward with...your team only has 5
hours left in the hackathon
• Solution 1 – Solution that solves having the ”closest”
parking spot to the classroom
• Solution 2 – Solution that solves for “fastest” (least
amount of time) way to get a parking spot
In Task: Decide on which
solution to move forward with?
How did you make the
decision?
!
Share Out: What was easy to do?
What was hard to do?
Fast Path I
25
Intuit - Confidential
………………………………………………………………
Decision Making… Shared Vision
Decision + Commitment + Execution = Outcome
Shared Vision
 Solid, Clear Logic
 Right Scope & Altitude
 Explicit Vs. Implicit… Put it in writing
Your Data & Assumptions Their Data & Assumptions
Where You Agree
 Simple Easy Words
 Separate The What Vs. the How
 Balance Inquiry and Advocacy
26
Best-in-Class Tool: All Roles Critical
DACI
Driver:
Drives decision process with key
stakeholders
Develops set of options and recommends “best
option” based on decision criteria
Approver:
Ultimate decision authority and
accountable for outcome
Ensures right people involved;
Defines decision criteria;
Defines date for decision;
Makes the decision & “owns it”
Contributor:
Contributes pre-decision input & perspective
Offers candid & relevant input;
Courage to challenge & disagree;
Will commit to final decision
Inform:
Informed post decision for clarity &
execution
Should understand decision…
“What criteria, who was involved, and
what is needed from them”
Critical Roles
Revisiting using DACI…
As a team, consider the same situation but now your team
has two potential solutions and the team does not have much
time to make decision.
Scenario:
The "team" came up with two solutions and they need to
decide which one to move forward with...your team only has 5
hours left in the hackathon
• Solution 1 – Solution that solves having the ”closest”
parking spot to the classroom
• Solution 2 – Solution that solves for “fastest” (least
amount of time) way to get a parking spot
In Task: Use this new model,
what is your decision?
Why?
!
Share Out: What other situations
would this be helpful to use?
Prototype
A prototype is a way to
visually express, test, and
iterate on your idea
Double Diamond
Research insights
into the problem
Synthesize areas
you want to focus
on
Ideate on potential
solutions
Implement solutions
that work
Software
Prototyping Fidelities
Low Medium High
What Fidelity Should I Use?
The fidelity of your prototype should match the fidelity of your questions.
The What
Am I building the
right thing?
The How
Am I building this thing
right?
VS.
Prototyping Examples
Hardware
Tom Chi:
Google Glass
Rule # 1: Find the quickest path to experience
Rule # 2: Doing is the best kind of thinking
Rule #3: Use materials that move at the speed of thought to
maximize your rate of learning
3 Prototyping Rules from Tom Chi:
How does software and
hardware complement
each other?
Lab
Rapid Prototyping
Rapid Prototyping
1. Generates ideas to problems you’re stuck on
2. Minimizes design flaws
3. Gain immediate user insights/ learnings
4. Saves time, costs and resources
If you can draw a line you can prototype
Rapid Prototyping
Customer Problem
Jane is late for the 4th time this
quarter and it’s only 6 weeks in.
Her professors are threatening to
drop her from the course if she
doesn’t start arriving on time.
Jane struggles finding parking
and can’t leave earlier because
she works part-time at a local
Bagel Shop called Lox and
Bagel. Her manager won’t let her
leave early because it’s the busy
time in the morning and there are
a lot new employees that are still
training.
Create a solution that can
help Jane find parking
quickly within her tight
schedule?
Consideration: What data
points would we collect to
help her timing and parking
problem?
Your Challenge
Rapid Prototyping
Roles
Greeter
Puppeteer
Scribe
Data Scientist
Thank You!
Any Questions?

UC Irvine WICS workshop feb 2017

  • 1.
    Hacking with Edge +WICS, Women in Information and Computer Science
  • 2.
    First, let’s meeteach other Your Name and add up to 2 words to the story
  • 3.
  • 4.
    HACKATHONS - FUD *Question snippets from Quora.com
  • 5.
    What’s in ahackathon? if (Hackathon.equals("SCARY")){ readReality(); } private void readReality(){ System.out.println("Fun and relaxed events"); System.out.println("Meet a lot of like minded people"); System.out.println("Passion to learn and create solutions"); System.out.println("Don’t have to be a genius / coding pro"); System.out.println("SWAG!"); System.out.println("Career Opportunities"); }
  • 6.
    Expressing your idea(or solution) through code
  • 7.
    It’s all interactivethis afternoon! How do you organize? Setting up your Dream Team How do you work together? Managing the dynamics and making decisions How do you express your idea or solution quickly? Prototyping
  • 8.
    hackathon - DREAMTEAM Form a team of 4 with the following roles. (If the group is small, stick with 3 members) In your team, call out your skillsets and identify team members with similar roles Ensure your group consists of # Hustler…Hustler and Visionary (2) # Hipster…the Designer # Hacker
  • 9.
  • 10.
    Hustler and Visionary- You don’t need to be a marketing guru or a COO Visionary # Are the business savvy ones # Find product - market fit & sell the product Hustler # Ensure timely goals are met during the course of the hackathon #Can put together a plan and move the team along #Find cheap or free resources to help your team
  • 11.
  • 12.
    The Hacker -brings their utility belt of technological solutions # Learn a javascript framework - React, Backbone, Angular # Stub data - Build a facade and not an engine Stub data in fixtures (JSON files), simple google fusion tables, or a very simple backend using something like Firebase, CouchDB #Hacker - You Don’t have to be a coding pro Many teams have more than 1 hacker…if you have “mad” front end skills, you can bootstrap the backend for a hackathon. If you have awesome backend skills, work with your hipster/designer to figure out how you can integrate what you coded with a front end experience
  • 13.
    Commonly used APIs Communications& Social APIs - Twillo, SendGrid, Facebook, Twitter, Reddit, Instagram, Google+ Geo APIs - Google Maps, Google places, Yelp, MapBox, Uber API Payment related APIs - Venmo, Paypal, Stripe Music APIs - Spotify, EchoNest, Google Play, SoundCloud * More examples on http://studenthackers.devpost.com/#rankings
  • 14.
  • 15.
    #Hipster - youdon’t have to be an artist # Think through the flows of a customer interaction # Prototype quickly and iterate to refine your team’s solution # Use Dribbble, Behance, pttrns.com for inspiration
  • 16.
    Got your team?Each person has a role? Now, let’s solve a potential hackathon problem
  • 18.
    The Customer Problem Janeis late for the 4th time this quarter and it’s only 6 weeks in. Her professors are threatening to drop her from the course if she doesn’t start arriving on time. Jane struggles finding parking and can’t leave earlier because she works part-time at a local Bagel Shop called Lox and Bagel. Her manager won’t let her leave early because it’s the busy time in the morning and there are a lot new employees that are still training Create a solution that can help Jane find parking quickly within her tight schedule? Consideration: What data points would we collect to help her timing and parking problem? The Challenge: 24 hours In your teams, break up the work and come with a plan to solve the problem within 24 hour period !
  • 19.
    Share Out: Whatwas easy to do? What was hard to do?
  • 20.
    Fast Path I 20 Intuit- Confidential ……………………………………………………………... GRPI Goals: Desired Outcomes/Great Experience/Needs of Sponsor Roles: Facilitator, Scribe, Timekeeper, Etc. Process: Agenda and Timeline Interpersonal: Ground Rules, Guidelines… • How we want to behave individually and as a team • How we want to communicate • What will be a great experience interpersonally Start here
  • 21.
    The Customer Problem Janeis late for the 4th time this quarter and it’s only 6 weeks in. Her professors are threatening to drop her from the course if she doesn’t start arriving on time. Jane struggles finding parking and can’t leave earlier because she works part-time at a local Bagel Shop called Lox and Bagel. Her manager won’t let her leave early because it’s the busy time in the morning and there are a lot new employees that are still training Create a solution that can help Jane find parking quickly within her tight schedule? Consideration: What data points would we collect to help her timing and parking problem? The Challenge: 24 hours In your teams, break up the work and come with a plan to solve the problem within 24 hour period ! Revisit the task using GRPI Framework…
  • 22.
    Share Out: Whatother situations would this be helpful to use?
  • 23.
    Making Decisions It’s thelast 5 hours of the hackathon and your team came up with two different solutions. Scenario: The "team" came up with two solutions and they need to decide which one to move forward with...your team only has 5 hours left in the hackathon • Solution 1 – Solution that solves having the ”closest” parking spot to the classroom • Solution 2 – Solution that solves for “fastest” (least amount of time) way to get a parking spot In Task: Decide on which solution to move forward with? How did you make the decision? !
  • 24.
    Share Out: Whatwas easy to do? What was hard to do?
  • 25.
    Fast Path I 25 Intuit- Confidential ……………………………………………………………… Decision Making… Shared Vision Decision + Commitment + Execution = Outcome Shared Vision  Solid, Clear Logic  Right Scope & Altitude  Explicit Vs. Implicit… Put it in writing Your Data & Assumptions Their Data & Assumptions Where You Agree  Simple Easy Words  Separate The What Vs. the How  Balance Inquiry and Advocacy
  • 26.
    26 Best-in-Class Tool: AllRoles Critical DACI Driver: Drives decision process with key stakeholders Develops set of options and recommends “best option” based on decision criteria Approver: Ultimate decision authority and accountable for outcome Ensures right people involved; Defines decision criteria; Defines date for decision; Makes the decision & “owns it” Contributor: Contributes pre-decision input & perspective Offers candid & relevant input; Courage to challenge & disagree; Will commit to final decision Inform: Informed post decision for clarity & execution Should understand decision… “What criteria, who was involved, and what is needed from them” Critical Roles
  • 27.
    Revisiting using DACI… Asa team, consider the same situation but now your team has two potential solutions and the team does not have much time to make decision. Scenario: The "team" came up with two solutions and they need to decide which one to move forward with...your team only has 5 hours left in the hackathon • Solution 1 – Solution that solves having the ”closest” parking spot to the classroom • Solution 2 – Solution that solves for “fastest” (least amount of time) way to get a parking spot In Task: Use this new model, what is your decision? Why? !
  • 28.
    Share Out: Whatother situations would this be helpful to use?
  • 29.
  • 30.
    A prototype isa way to visually express, test, and iterate on your idea
  • 32.
  • 33.
    Research insights into theproblem Synthesize areas you want to focus on Ideate on potential solutions Implement solutions that work
  • 35.
  • 36.
  • 37.
    What Fidelity ShouldI Use? The fidelity of your prototype should match the fidelity of your questions. The What Am I building the right thing? The How Am I building this thing right? VS.
  • 38.
  • 39.
  • 40.
  • 41.
    Rule # 1:Find the quickest path to experience Rule # 2: Doing is the best kind of thinking Rule #3: Use materials that move at the speed of thought to maximize your rate of learning 3 Prototyping Rules from Tom Chi:
  • 42.
    How does softwareand hardware complement each other?
  • 43.
  • 44.
    Rapid Prototyping 1. Generatesideas to problems you’re stuck on 2. Minimizes design flaws 3. Gain immediate user insights/ learnings 4. Saves time, costs and resources If you can draw a line you can prototype
  • 45.
    Rapid Prototyping Customer Problem Janeis late for the 4th time this quarter and it’s only 6 weeks in. Her professors are threatening to drop her from the course if she doesn’t start arriving on time. Jane struggles finding parking and can’t leave earlier because she works part-time at a local Bagel Shop called Lox and Bagel. Her manager won’t let her leave early because it’s the busy time in the morning and there are a lot new employees that are still training. Create a solution that can help Jane find parking quickly within her tight schedule? Consideration: What data points would we collect to help her timing and parking problem? Your Challenge
  • 46.
  • 47.