Your SlideShare is downloading. ×
Modern Web Design & Development Workflow: Ben Klocek
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Modern Web Design & Development Workflow: Ben Klocek

628

Published on

It's no mystery that building websites for the modern web affects workflow considerably. Static comps passed from designer to developer with nary a word no longer suffice. An integrated team, all …

It's no mystery that building websites for the modern web affects workflow considerably. Static comps passed from designer to developer with nary a word no longer suffice. An integrated team, all involved from the beginning is becoming a necessity for successful site launches. Ben Klocek will share some of the industry best practices that can help smooth out the design and development process for building modern websites. http://bracia.com

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
628
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • \n
  • Sitting at your desk, working hard\n
  • getting that site ready for launch\n
  • when you boss walks in, or you get a call from a client\n
  • “I want a modern website, with\n
  • social media\n
  • video\n
  • ecommerce\n
  • \n
  • -computer, iPad, and iPhone.\n
  • and those other phones too.\n
  • “Ok” you say. “I think I can help you with that. It’s not rocket science.”\n
  • In the back of your head, you’re thinking, “All this new stuff!\nI’ve been learning about this stuff. Keeping up on twitter, reading the websites, going to conferences, but its all so complex!”\n
  • And here’s the main challenge. \n\n\n
  • So lets dive in.\n
  • - making sure everyone is on the same planet.\n- Understanding expectations:\n- they will likely already be sharing this with you.\n- self-diagnosis not to be trusted. Doctor & malpractice.\n-Google offers <insert your favorite functionality here> for free, why do you charge for/can't you build the same thing?\n
  • - determines team\n- technology\n- ultimately whether you can do/want to take the project\n\n- no? either need an education, or not someone you want to work with.\n
  • - measurable\n- Focus on tasks\n- formalize the process\n- you become keeper of the vision\n- Save the “how” for after the contract is signed.\n
  • - Typical full stack team\n\n
  • - a little less glamorous, but a bit more practical. \n- Typical full stack team\n- A good Responsive Design website REQUIRES close collaboration between IA, Creative, and Technology\n\n
  • \n
  • - goal focused & measurable\n
  • - minify, gzip, HTML5 BoilerPlate .htaccess, compress images\n- lazy loading of scripts with yepnope.js or modernizr.js\n- google pagespeed\n
  • - works on many devices\n- progressive enhancement\n\n
  • We’ll hear about that from Carl Sue later.\n
  • - meaningful to people visiting\n
  • - research: red routes, goals, grids, modules, content (@karenmcgrane), thumbnail sketches\n- prototype: Foundation, Bootstrap, in browser, \n- design: increasing fidelity\n- communicate: clients, no big reveal\n
  • - fast lane, main user routes to goal completion\n
  • - page table for content\n- Jeri Hastava\n
  • Navigation, newsletter sign up, call to action block, social proof\n- Solve small problems\n
  • \n
  • \n
  • - components in photoshop\n- most in code\n- typography “font-select” style-guide\n
  • \n
  • \n
  • - percentage based\n
  • - bandwidth\n- sizes\n
  • -target a device based on specific attributes & deliver certain CSS to it.\n-Devices that don’t recognize @media, or don’t match a query, will get the mobile view.\n-Content should determine breakpoints. We'll simply define rules as more real estate becomes available.\n
  • - Michael Slater will go into it more later\n
  • And here’s the main challenge. \n\n\n
  • \n
  • \n
  • Transcript

    • 1. lolzcats

    ×