Hip Hop & The Web

Hip Hop & The Web

How A Culture Can Define A Process

Db9adb5582199abccf93d3d8c84fd4b9?s=128

Travis Miller

June 22, 2013
Tweet

Transcript

  1. How A Culture Can De ne A Process HIP HOP

    & THE WEB TRAVIS MILLER @tm_web #hiphopweb
  2. INTRO

  3. "We don’t have any rules, everybody is trying to figure

    it out. That’s why the Internet is like the Wild West. The Wild, Wild West. We need to write the new rules." Jay-Z
  4. HIP HOP

  5. ELEMENTS OF HIP HOP

  6. ELEMENTS OF THE WEB

  7. ELEMENTS OF THE WEB INFLUENCE FREESTYLE MIX & FLOW DEMO

    STUDIO SHOW TIME
  8. INFLUENCE

  9. INFLUENCE

  10. INFLUENCE INSPIRATION

  11. INFLUENCE

  12. INFLUENCE BUILD OFF WHAT EXISTS

  13. DEFINE THE PROBLEM RELATE TO THE CLIENT/ AUDIENCE INSPIRATION FOR

    THE PROJECT INFLUENCE
  14. + Project Brief + Content Outline + Requirements Analysis INFLUENCE

  15. FREESTYLE

  16. FREESTYLE BRAINSTORMING

  17. FREESTYLE + Site Map + Sketches / Wireframes (lo-fi) +

    Design Elements
  18. FREESTYLE

  19. FREESTYLE

  20. FREESTYLE + Sliders + Buttons + Hovers + Animations

  21. MIX & FLOW

  22. Mix & Flow is combining your findings, content and other

    outputs with design and direction. MIX & FLOW
  23. + Structured Content / Wireframes (hi-fi) + Style Guidelines +

    Resource Collection MIX & FLOW
  24. [header] [body] [footer] HTML ELEMENTS MIX & FLOW

  25. SONG ELEMENTS [chorus] [verse] [hook] MIX & FLOW

  26. STRUCTURE CONTENT LIKE LYRICS MIX & FLOW

  27. [chorus] > consistent elements (page to page) [verse] > main

    content (differs for each page) [hook] > call to action / next steps for users MIX & FLOW
  28. MIX & FLOW

  29. MIX & FLOW

  30. MIX & FLOW

  31. RESOURCES MIX & FLOW

  32. MIX & FLOW

  33. = github google twitter MIX & FLOW

  34. DEMO

  35. DEMO PROTOTYPING

  36. DEMO

  37. DEMO + Rapid Prototypes + Design Integration + Tickets &

    Tasks
  38. DEMO

  39. DEMO

  40. DEMO

  41. DEMO DEVTOOLS AUTOSAVE!!!

  42. DEMO DOCUMENTATION

  43. DEMO

  44. INTERCHANGEABLE

  45. STUDIO

  46. STUDIO REFINE YOUR MASTERPIECE

  47. STUDIO + Testing + Iterations + Design Integration / Refinement

  48. STUDIO HEAVY CRITIQUE AND TESTING

  49. STUDIO TOOLS

  50. STUDIO

  51. STUDIO REVIEW RELEASE REPEAT

  52. SHOW TIME

  53. SHOW TIME

  54. SHOW TIME PRACTICE

  55. SHOW TIME + Optimization + Maintenance + Support

  56. SHOW TIME PERFORMANCE

  57. SHOW TIME

  58. SHOW TIME

  59. SHOW TIME

  60. SHOW TIME

  61. OUTRO

  62. BE COOL

  63. THANKS @tm_web #hiphopweb