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
Picasso Pirate
Search
Derik Strattan
October 15, 2013
Design
0
310
Picasso Pirate
Derik Strattan
October 15, 2013
Tweet
Share
More Decks by Derik Strattan
See All by Derik Strattan
Using LinkedIn
derikulous
0
77
Other Decks in Design
See All in Design
root COMPANY DECK / We are hiring!
root_recruit
2
26k
モビリティプラットフォームの未来を築くクラウド基盤
kossykinto
0
190
Diverse Design Team Deck
diverse
0
410
TUNAG BOOK 2024
stmn
PRO
0
1.3k
CREATIVE CLASS受講課題|無印良品を題材としたブランド再構築について
happy_ferret153
0
540
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
1.8k
Goodpatch Tour💙 / We are hiring!
goodpatch
31
1M
Meet, Learn, Grow × AI ― コミュニティで加速するスキル循環 「コミュニティと関わり方」
tame
1
360
地理院地図をもっと楽しく!れきちず新機能のご紹介
hjmkth
1
420
【Designship 2025|10.11】デザイン組織と事業貢献、その挑戦と結果。
payatsusan213
1
890
AI時代に問われる、リサーチの感受性──地域⇄大企業の現場から見えた「違和感」との向き合い方
muture
PRO
0
400
プロダクトリニューアルと同時に進める初めてのデザインシステム
techtekt
PRO
0
400
Featured
See All Featured
Code Reviewing Like a Champion
maltzj
527
40k
How to Talk to Developers About Accessibility
jct
1
100
Documentation Writing (for coders)
carmenintech
77
5.2k
Deep Space Network (abreviated)
tonyrice
0
35
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Mind Mapping
helmedeiros
PRO
0
53
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.8k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.5k
AI Search: Where Are We & What Can We Do About It?
aleyda
0
6.9k
Making Projects Easy
brettharned
120
6.6k
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
99
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
430
Transcript
A pirate’s life for me. Derik Strattan
None
I want a great looking website, but I
don’t want to pay for it!
blog.mlin.net
Caveat: Stealing is stealing. Check licenses, and buy if
you can. • Designers worked hard to make these designs, and if you can pay, then do so. • Using a pay-‐for template WITHOUT paying will land you on Hacker News. And it won’t be to say how awesome your app is. Basically: DON’T BE A DOUCHE.
Two Words: Live Preview. THEMES: http://themeforest.net/ http://bootswatch.com/2/
http://code.divshot.com/themestrap/
Click Live Preview
Right click -‐ View Page Source
Select all html, copy/paste to index.html.erb
Right click, Inspect Element
Right pane, inspect CSS
Pane: Style Editor Notice the multiple CSS stylesheets
Sublime Editor – Create file in app/assets/stylesheets
Inspector pane: Select CSS file name, copy/ paste as name
of newly created CSS file.
Back to Pane: Style Editor Copy all these rules.
Sublime Editor – Paste copied CSS rules in new
CSS file
Rinse and Repeat for ALL CSS stylesheets
Copying Javascript: Right click, View Page Source
Holy! It’s clickable! Do it.
Sweet, Sweet Javascript. Copy everything here. Check license.
MIT or Apache = use it.
Sublime – Make a new file in app/assets/javascripts
Name .JS file exactly as View Page Source. Paste
in JS
Rinse/Repeat for all custom JS files. www.wonacottpr.com
Go forth and conquer, my Droogies.