Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Hip Hop & The Web
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Travis Miller
June 22, 2013
Design
560
3
Share
Hip Hop & The Web
How A Culture Can Define A Process
Travis Miller
June 22, 2013
More Decks by Travis Miller
See All by Travis Miller
Branding With Sass @ Front Porch 2015
tbmiller
0
270
Starter Island - Competition Brief
tbmiller
0
130
Remote. Commit. Push.
tbmiller
2
390
Connecting Through Code
tbmiller
0
79
Other Decks in Design
See All in Design
AIネイティブスタートアップにおけるプロダクト開発の新常識 / Product Development Tips in AI-Native Startups
saka2jp
2
1.2k
爆速開発でAIプロダクトが40万インプレッションになった話
tsubura
0
230
公開スライド)熊本市様-電子申請中級編
garyuten
0
1.2k
Goodpatch Tour💙 / We are hiring!
goodpatch
31
1.1M
体験負債を資産に変える組織的アプローチ
hikarutakase
0
1.1k
文化のデザイン - Soft Impact of Design
atsushihomma
0
180
AIエージェントが対話的なUIを返す!MCP−UIで変わるユーザ体験
daitasu
1
190
Spacemarket Brand Guide
spacemarket
2
490
20260215独立行政法人科学技術振興機構(JST) 社会技術研究開発センター(RISTEX)ケアが根づく社会システム _公開シンポジウム
a2k
1
150
全員がアウトプットを出せる時代、 誰を採用する?
nishame
0
490
CREATIVE CLASS受講課題|無印良品を題材としたブランド再構築について
happy_ferret153
0
850
Vibe Coding デザインシステム
poteboy
3
1.8k
Featured
See All Featured
Code Reviewing Like a Champion
maltzj
528
40k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
480
Unsuck your backbone
ammeep
672
58k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
150
Designing for Performance
lara
611
70k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
2
720
Mind Mapping
helmedeiros
PRO
1
150
SEO for Brand Visibility & Recognition
aleyda
0
4.5k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
500
How to Ace a Technical Interview
jacobian
281
24k
Transcript
How A Culture Can De ne A Process HIP HOP
& THE WEB TRAVIS MILLER @tm_web #hiphopweb
INTRO
"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
HIP HOP
ELEMENTS OF HIP HOP
ELEMENTS OF THE WEB
ELEMENTS OF THE WEB INFLUENCE FREESTYLE MIX & FLOW DEMO
STUDIO SHOW TIME
INFLUENCE
INFLUENCE
INFLUENCE INSPIRATION
INFLUENCE
INFLUENCE BUILD OFF WHAT EXISTS
DEFINE THE PROBLEM RELATE TO THE CLIENT/ AUDIENCE INSPIRATION FOR
THE PROJECT INFLUENCE
+ Project Brief + Content Outline + Requirements Analysis INFLUENCE
FREESTYLE
FREESTYLE BRAINSTORMING
FREESTYLE + Site Map + Sketches / Wireframes (lo-fi) +
Design Elements
FREESTYLE
FREESTYLE
FREESTYLE + Sliders + Buttons + Hovers + Animations
MIX & FLOW
Mix & Flow is combining your findings, content and other
outputs with design and direction. MIX & FLOW
+ Structured Content / Wireframes (hi-fi) + Style Guidelines +
Resource Collection MIX & FLOW
[header] [body] [footer] HTML ELEMENTS MIX & FLOW
SONG ELEMENTS [chorus] [verse] [hook] MIX & FLOW
STRUCTURE CONTENT LIKE LYRICS MIX & FLOW
[chorus] > consistent elements (page to page) [verse] > main
content (differs for each page) [hook] > call to action / next steps for users MIX & FLOW
MIX & FLOW
MIX & FLOW
MIX & FLOW
RESOURCES MIX & FLOW
MIX & FLOW
= github google twitter MIX & FLOW
DEMO
DEMO PROTOTYPING
DEMO
DEMO + Rapid Prototypes + Design Integration + Tickets &
Tasks
DEMO
DEMO
DEMO
DEMO DEVTOOLS AUTOSAVE!!!
DEMO DOCUMENTATION
DEMO
INTERCHANGEABLE
STUDIO
STUDIO REFINE YOUR MASTERPIECE
STUDIO + Testing + Iterations + Design Integration / Refinement
STUDIO HEAVY CRITIQUE AND TESTING
STUDIO TOOLS
STUDIO
STUDIO REVIEW RELEASE REPEAT
SHOW TIME
SHOW TIME
SHOW TIME PRACTICE
SHOW TIME + Optimization + Maintenance + Support
SHOW TIME PERFORMANCE
SHOW TIME
SHOW TIME
SHOW TIME
SHOW TIME
OUTRO
BE COOL
THANKS @tm_web #hiphopweb