designers @ hackathonsEric Bell@ericthebell
@ericthebell #UXinSpaceJust a guy• UX team-of-one at Addvocate• Moved to Bay Area last summer• Tokyo and Seattle previousl...
Hackathons 101
@ericthebell #UXinSpacetypical hackathon• weekend event, Sat-Sun• some focus/theme + rules/prizes• pitches, teams form, 24...
@ericthebell #UXinSpacethemes• solve a problem in an area• do something with a tool/platform
@ericthebell #UXinSpaceattendees: who?• predominantly developers (of all stripes)• smattering of design, business types• d...
@ericthebell #UXinSpaceattendees: why?• learn something new• meet people• work on something interesting
As a designer
@ericthebell #UXinSpacemy desires• something different, change of pace fromworkweek design problems• challenge of time con...
@ericthebell #UXinSpacemy benefits• hone existing skills/process• practice new/different skills(you are what you label your...
@ericthebell #UXinSpacemy roles• scoping• sketching• prototyping• front end design/CSS• wander around + advise UX
@ericthebell #UXinSpacecase: Big DataPollWiser: Mappingelection poll results tocandidate-specific tweetsentiment.role: fron...
@ericthebell #UXinSpaceFrood: Avoiding text entry[for food] on mobiledevices at all costs.role: IA, IxD, prototypinglearne...
@ericthebell #UXinSpacecase: Discover SFPOPOS: Discover SF’shidden public spaces.role: Not my project. ByConnie Yeh, Wendy...
@ericthebell #UXinSpacemy lessons• overall design strategy• problem scoping, build what you need• think through task flows,...
Resources
@ericthebell #UXinSpacecoming up• June 1-2: SF Day of Civic hacking• June 15-16: AngelHack SV• June 23: API Hackday
@ericthebell #UXinSpacefind more• Eventbrite (“hack*” near SF by date)• Hackathon.io• Hackerleague.org
Thanks.Questions?@ericthebell #UXinSpace
Upcoming SlideShare
Loading in …5
×

Designers @ Hackathons

5,290 views

Published on

Why designers should go to hackathons. Presented at UX in Space! May 16, 2013. https://uxinspace-vol2.eventbrite.com/

Published in: Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,290
On SlideShare
0
From Embeds
0
Number of Embeds
4,739
Actions
Shares
0
Downloads
5
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Designers @ Hackathons

  1. 1. designers @ hackathonsEric Bell@ericthebell
  2. 2. @ericthebell #UXinSpaceJust a guy• UX team-of-one at Addvocate• Moved to Bay Area last summer• Tokyo and Seattle previously• Design by way of info science + HCI• A fan of platypodes
  3. 3. Hackathons 101
  4. 4. @ericthebell #UXinSpacetypical hackathon• weekend event, Sat-Sun• some focus/theme + rules/prizes• pitches, teams form, 24~36 hrs of hacking• food, sometimes overnight venue• generally free, sponsor-covered
  5. 5. @ericthebell #UXinSpacethemes• solve a problem in an area• do something with a tool/platform
  6. 6. @ericthebell #UXinSpaceattendees: who?• predominantly developers (of all stripes)• smattering of design, business types• desired roles encouraged via eventtickets
  7. 7. @ericthebell #UXinSpaceattendees: why?• learn something new• meet people• work on something interesting
  8. 8. As a designer
  9. 9. @ericthebell #UXinSpacemy desires• something different, change of pace fromworkweek design problems• challenge of time constraints, evaluate +execute minimal necessary process
  10. 10. @ericthebell #UXinSpacemy benefits• hone existing skills/process• practice new/different skills(you are what you label yourself)• meet + work with new people(ideal for job hunting)
  11. 11. @ericthebell #UXinSpacemy roles• scoping• sketching• prototyping• front end design/CSS• wander around + advise UX
  12. 12. @ericthebell #UXinSpacecase: Big DataPollWiser: Mappingelection poll results tocandidate-specific tweetsentiment.role: front end design andCSSlearned about some niftytools and databasesVisualizationHover option 1: display most popular positive and negative tweet for one candidatesimultaneouslyHover option 2: only display most populartweet, color based on pos/neg sentimentHover option 3: show most popular tweetfor each candidate simultaneouslyY axis: display Y axis only between max and min values ofvisible dataTweet display:ProcessFunctionalityPollWiserAudience: Data-centricWhat interesting things did we do with the data?Explain our process and back end, discoveries,points of interest.Goal: explaining our processOverall goalsOur overarching goal is to present toa much larger audience.They will be a similar type ofaudience as the hackathon, but withhigher expectations.Audience: Info vizVisual polish of what we are displaying. Newinsights that this gives us.Goal: visual polishPresenting at DataWeek keynote Thursday AMAudience: LaymenMany people will just want to play with it as atool.Goal: URL with a minimally functional toolPopular positive Romneytweet of the dayPopular negative tweet(either candidate)Popular negative tweet(either candidate)Popular positive Obamatweet of the dayAug 12 Sep 3Most popular Obama tweetonly (color by pos/neg)Aug 12Most popular Romneytweet of the dayMost popular Obama tweetof the dayAug 12 Easier to compare tweet infoMouseover anywhere on dayvertical50%6040Timeframe (x axis): somecheap but elegant way toadjust the timeframe.Zoom links below areacceptable, as are sliders.Avoid anything that has tobe expanded before it canbe selected (pulldowns,accordion behavior).@username Real Name | mon dd hh:mm | StateContent of tweet goes here, up to full 140 charactersbut display only text (no links)Tweet details12ptnormal weightTweet content14ptbold weightPick a decent web font like PT Sanshttp://www.google.com/webfonts/specimen/PT+Sanspositive Romney tweetpositive Obama tweetnegative tweetGooglehttp://pollwiser.infoPollWiserGraph areaPollWiserBringing granular contextual insights to election poll dataList of statesCredits… data sources, Angelhack, other shout-outstimeframe controlswebfont: Open Sanshttp://www.google.com/webfonts#UsePlace:use/Collection:Open+SansOverall layoutFill window if possibleAll details up for debateand ease-of-codingAbility to drill down by stateSince we have state data, thisshould be easy.Overlaying on a map would becool, but choosing from a list isbetter than nothing.If we weight each states datausing its electoral votes(proportional to population) wecan even use that to generateour nation-wide poll data.domainWe need a domain. Somewhere to put this forvisitors to play with, and a URL to point to atthe very end of our presentation.
  13. 13. @ericthebell #UXinSpaceFrood: Avoiding text entry[for food] on mobiledevices at all costs.role: IA, IxD, prototypinglearned that prototypingin code makes for betterdemoscheck it out: bit.ly/froodhealthcase: Health 2.0
  14. 14. @ericthebell #UXinSpacecase: Discover SFPOPOS: Discover SF’shidden public spaces.role: Not my project. ByConnie Yeh, Wendy Fong,and Lily ChandrasekherBeing spoken about at tonight’sUrban Tech SF (right now).check it out: sfpopos.com
  15. 15. @ericthebell #UXinSpacemy lessons• overall design strategy• problem scoping, build what you need• think through task flows, storyboards• mock up + prototype broader concept• presentation strategy + design
  16. 16. Resources
  17. 17. @ericthebell #UXinSpacecoming up• June 1-2: SF Day of Civic hacking• June 15-16: AngelHack SV• June 23: API Hackday
  18. 18. @ericthebell #UXinSpacefind more• Eventbrite (“hack*” near SF by date)• Hackathon.io• Hackerleague.org
  19. 19. Thanks.Questions?@ericthebell #UXinSpace

×