Upgrade to Pro — share decks privately, control downloads, hide ads and more …

HackNy Workshop - Design

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Kyle Johnson Kyle Johnson
June 26, 2014
Design
0
50

HackNy Workshop - Design

Basic Design fundamentals for hackers and a short demos of adobe kuler and new css trends/tricks.

Avatar for Kyle Johnson

Kyle Johnson

June 26, 2014
Tweet

Other Decks in Design

See All in Design
はじめての演奏会フライヤーデザイン
Avatar for Kaito Kikuchi chorkaichan
1
220
From the Visible Crossroads: Turning Outputs into Outcomes
Avatar for takai_kanako takaikanako
2
1k
ユーザー像を「みてね」らしく可視化する　家族アルバムみてねUXリサーチチームの取り組み
Avatar for MIXI DESIGN mixi_design
PRO
3
720
Shaolin_Showdown
Avatar for Sol Metts solmetts
0
280
企業にデザインが融けたとき、デザイナーにできること。事業会社12年間の探究と葛藤 / Designship2025
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
0
1.4k
2026年、デザイナーはなにに賭ける？
Avatar for Kazuhiro Tobita 0b1tk
0
470
アクセシビリティ推進を続けられるようにするヒント - Accessibility Conference CHIBA 2025
Avatar for uto usui uto
0
180
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
Avatar for 株式会社ルート root_recruit
0
380
公開スライド）熊本市様-電子申請中級編
Avatar for @Garyuten garyuten
0
820
アンエシカルデザインの枠組みの提案 -HCD-Netダークパターン研究会活動報告-
Avatar for Yu Morita securecat
0
190
kintone Style Book
Avatar for kintone kintone
6
10k
TWCP#21 UXデザインと哲学のはなし
Avatar for MAMIYA Shinsuke shinn
0
260

Featured

See All Featured
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
210
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
190
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
287
14k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
21k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.7k
Fireside Chat
Avatar for paigeccino paigeccino
41
3.8k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
273
21k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.1k
Money Talks: Using Revenue to Get Sh*t Done
Avatar for Nikki Halliwell nikkihalliwell
0
150
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
57
14k
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
200

Transcript

  1. A Hacker’s Guide to Solid Design by: @kylejson

  2. #1 Your Designs should look like CRAP.

  3. Contrast

  4. Repetition

  5. Alignment

  6. Proximity

  7. #2 Use an SOS type of design workflow.

  8. See

  9. Outline

  10. Shape

  11. #3 Colors

  12. Adobe Kuler

  13. Use Math HSB

  14. What about designing for mobile?

  15. Responsive Design You can use a responsive grid system or

    roll your own media queries!

  16. What about sexy?

  17. None

  18. Hipster CSS Cover Photos CSS Animations Text Manipulation Know your

    selectors Shadows Flexbox Faux Parallax

  19. Recap CRAP -> SOS - > Colors Don’t make me

    think!

  20. Resources Behance.com Dribbble.com HackDesign.org Goodui.org My Mentor/ A few of

    my Idols: @mlwebco @paul_irish @chriscoyier @contrast8

  21. Thanks =)