Sites that defy the Reality Triangle: Good, Fast AND Cheap

Sites that defy the Reality Triangle: Good, Fast AND Cheap Miko Coffey BFA FRSA www.usingmyhead.com miko@usingmyhead.com

Reality Triangle High Quality Short Timeframe Low Cost • Say you can have 2 out of 3 but not all

Web Apps • Web-based ‘software’ applications • Replace expensive installed software or ofﬂine processes • Rely on volume/advertising for income • Build it once, sell it over & over • Remove technical barrier to entry • Do it all from any web browser

Web Project Lifecycle Before Web Apps • Planning & Content Dev: Project Manager ‣ Source / coordinate suppliers, such as web agency, hosting, content management system (CMS) ‣ Coordinate copywriting and content prep; may work with a Copywriter and/or Information Architect ‣ Client-agency liaison

Web Project Lifecycle Before Web Apps • Design: Web/Graphic Designer ‣ Create/source logos & graphics (using Adobe Illustrator) ‣ Source photography from Stock Agency (eg. Getty Images) ‣ Create web page mockup in Adobe Photoshop ‣ Take feedback from client, tweak Photoshop mockup(s) then present to client again (repeat as necessary)

Web Project Lifecycle Before Web Apps • Build: Web Developer ‣ Slice Photoshop mockup into pieces to slot into HTML pages ‣ Hand-code HTML pages / templates, sometimes to ﬁt an expensive Content Management System (CMS) ‣ Test code to be cross-browser & W3C compliant ‣ Input contents into pages (may be delegated to Assistant/Junior Developer)

Web Project Lifecycle Before Web Apps • Build: Web/Specialist Technical Developer ‣ Custom-build online forms, e-commerce shopping cart or other functionality; bespoke or to ﬁt CMS ‣ If using Enterprise CMS: requires specialist training or use of CMS provider’s technical team to understand how to adapt existing modules to ﬁt the client’s needs ‣ Flash, video or other rich media content requires high spec / bandwidth server

Web Project Lifecycle Before Web Apps • To make changes to website content or design: ‣ Client tells project manager ‣ Project manager tells agency ‣ Agency tells designer/developer to implement ‣ Client approves ‣ Client pays - in terms of ££ and time

YAY for web apps!

Web Project Lifecycle After Web Apps • Planning & Content Development ‣ Choose which website web app to use ‣ No hosting or CMS to choose in addition ‣ Still have to create GREAT content ‣ Still have to think about how best to present your content to the online audience

Web Project Lifecycle After Web Apps • Design ‣ Create/source logos & graphics from online marketplace or free WebApp such as Aviary.com ‣ Source free/cheap photography from istockphoto.com, ﬂickr.com or Stock Xchange (www.sxc.hu) ‣ Edit photos/graphics (sizing, cropping, etc) in free software such as Picasa or GIMP, or Aviary.com

Web Project Lifecycle After Web Apps • Build ‣ Paste contents from MS Word or txt document into free/cheap hosted CMS such as Weebly, Wix, Squarespace or WordPress ‣ Choose an existing free template to act as starting point for web page design ‣ Upload logos & graphics, change colours, etc on- the-ﬂy to customise the site design to your wishes ‣ Template code has already been pre-tested for cross-browser compatibility / W3C compliance

Web Project Lifecycle After Web Apps • Build - added functionality ‣ Create forms, shopping cart or other functionality by installing plugins or embedding from other WebApps such as Wufoo or MailChimp ‣ Host Flash, Powerpoint or other rich media content on Vimeo, YouTube or other service and link/embed into your web pages

Web Project Lifecycle After Web Apps • To make changes: ‣ Login to the site admin & make the changes. Preview it on-screen, then go live. ‣ Client has control - may choose to have a web consultant or designer/developer carry out complex requests

Demo: Squarespace • Hosted CMS - nothing else to buy/install • Different levels of subscription give different levels of site complexity/features • Basic Pro account = same price as regular hosting • VERY intuitive interface • Visual design editor requires NO custom CSS or programming knowledge to create unique designs

squarespace.com

aviary.com - create banners / resize logos

colourlovers.com - choose colour palettes

tools.dynamicdrive.com/gradient/ - make gradients

istockphoto.com - stock photos from £1

Web App Website Tips • Make a sketch and/or outline of your site before you start (a napkin will do!) • Prepare all text content in .txt or .rtf format, not MS Word .doc • Have everything ready in 3 folders: ‣ Content - for all txt content pages ‣ Design - for logos / design elements ‣ Photos - for all photos • Remember you can change anything easily later

Let’s Go!

Thank You Miko Coffey My portfolio of Squarespace sites: http://usingmyhead.squarespace.com www.usingmyhead.com miko@usingmyhead.com mob: 0794 100 5431 twitter: mikosoft skype: miko.coffey

http://blog.wiserearth.org	102
http://blog.wiser.org	15
http://www.slideshare.net	2
https://www.mturk.com	1

Sites that defy the Reality Triangle: Good, Fast AND Cheap

by Miko Coffey on Jan 14, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

4 Embeds 120

Statistics

Sites that defy the Reality Triangle: Good, Fast AND Cheap — Presentation Transcript