Sites that defy the Reality Triangle: Good, Fast AND Cheap
-
date post
18-Oct-2014 -
Category
Education
-
view
2.851 -
download
0
description
Transcript of Sites that defy the Reality Triangle: Good, Fast AND Cheap
![Page 1: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/1.jpg)
Sites that defy the Reality Triangle:
Good, Fast AND Cheap
Miko Coffey BFA FRSA
![Page 2: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/2.jpg)
Reality Triangle
• Say you can have 2 out of 3 but not all
High Quality
Low Cost
Short Timeframe
![Page 3: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/3.jpg)
Web Apps
• Web-based ‘software’ applications
• Replace expensive installed software or offline 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
![Page 4: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/4.jpg)
![Page 5: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/5.jpg)
Web Project LifecycleBefore 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
![Page 6: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/6.jpg)
Web Project LifecycleBefore 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)
![Page 7: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/7.jpg)
Web Project LifecycleBefore Web Apps
• Build: Web Developer
‣ Slice Photoshop mockup into pieces to slot into HTML pages
‣ Hand-code HTML pages / templates, sometimes to fit 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)
![Page 8: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/8.jpg)
Web Project LifecycleBefore Web Apps
• Build: Web/Specialist Technical Developer
‣ Custom-build online forms, e-commerce shopping cart or other functionality; bespoke or to fit CMS
‣ If using Enterprise CMS: requires specialist training or use of CMS provider’s technical team to understand how to adapt existing modules to fit the client’s needs
‣ Flash, video or other rich media content requires high spec / bandwidth server
![Page 9: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/9.jpg)
Web Project LifecycleBefore 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
![Page 10: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/10.jpg)
YAY for web apps!
![Page 11: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/11.jpg)
Web Project LifecycleAfter 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
![Page 12: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/12.jpg)
Web Project LifecycleAfter Web Apps
• Design
‣ Create/source logos & graphics from online marketplace or free WebApp such as Aviary.com
‣ Source free/cheap photography from istockphoto.com, flickr.com or Stock Xchange (www.sxc.hu)
‣ Edit photos/graphics (sizing, cropping, etc) in free software such as Picasa or GIMP, or Aviary.com
![Page 13: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/13.jpg)
Web Project LifecycleAfter 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-fly to customise the site design to your wishes
‣ Template code has already been pre-tested for cross-browser compatibility / W3C compliance
![Page 14: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/14.jpg)
Web Project LifecycleAfter 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
![Page 15: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/15.jpg)
Web Project LifecycleAfter 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
![Page 16: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/16.jpg)
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
![Page 17: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/17.jpg)
squarespace.com
![Page 18: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/18.jpg)
aviary.com - create banners / resize logos
![Page 19: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/19.jpg)
colourlovers.com - choose colour palettes
![Page 20: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/20.jpg)
tools.dynamicdrive.com/gradient/ - make gradients
![Page 21: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/21.jpg)
istockphoto.com - stock photos from £1
![Page 22: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/22.jpg)
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
![Page 23: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/23.jpg)
Let’s Go!
![Page 24: Sites that defy the Reality Triangle: Good, Fast AND Cheap](https://reader034.fdocuments.net/reader034/viewer/2022051816/54421f90b1af9f3d0a8b4575/html5/thumbnails/24.jpg)
Thank YouMiko Coffey
My portfolio of Squarespace sites: http://usingmyhead.squarespace.com
mob: 0794 100 5431twitter: mikosoftskype: miko.coffey