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
逆向きUIの世界〜AndroidアプリのRTL言語対応〜
akatsuki174
1
790
はじめての演奏会フライヤーデザイン
chorkaichan
1
220
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
1.1k
「稼ぐ」だけでなく 「還す」ためのデザイン / Designship2025
culumu
1
570
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは?~操作を減らし、成果を最大にするための設計~
ncdc
0
110
OJTで学んだ 「心を動かす」ファシリテーション
saki822
1
230
見栄えと使いやすさの先にある 特別感 をデザインする / Designing a Sense of Specialness Beyond Aesthetics and Usability
bitkey
PRO
0
250
2026の目標「もっと定量的に事業、会社へ貢献する!」
yuri_ohashi
0
680
Figmaレクチャー会Part1 基本のき編@千株式会社 社内勉強会
designer_no_pon
2
250
逆向きUIの世界 〜iOSアプリのRTL言語対応〜
akatsuki174
1
500
一次体験を起点にしたUX改善の取り組み / Direct Experience Driven UX Improvements
bitkey
PRO
0
370
プラットフォームに馴染むモバイルアプリデザイン / Mobile App UI Design Lunch LT
pixyzehn
0
130
Featured
See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
66
37k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
140
Why Our Code Smells
bkeepers
PRO
340
58k
Music & Morning Musume
bryan
47
7.1k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
9.5k
The World Runs on Bad Software
bkeepers
PRO
72
12k
A Modern Web Designer's Workflow
chriscoyier
698
190k
Abbi's Birthday
coloredviolet
1
4.7k
Rebuilding a faster, lazier Slack
samanthasiow
85
9.4k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
150
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
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.