Step for Planning a Website Design, Development & Build
9 likes2,445 views
The document outlines the steps for planning a website, using the website IAmInfusion.com.au as a case study. It discusses 5 steps for planning a website: 1) information gathering, 2) wireframing, 3) site architecture, 4) determining extensions, and 5) planning the build. For each step, it provides examples of tasks and tools used in planning IAmInfusion's website, which involved testing different shopping cart extensions to meet its specific needs. The document concludes by discussing next steps for improving IAmInfusion's website.
Step for Planning a Website Design, Development & Build
- 1. Steps for Planning a Website A Case Study of Build of IAmInfusion.Com.Au Tuesday, 19 November 13
- 2. What are we talking about The steps, the process and mistakes Photo credits: Flickr - Jayel Aheram Tuesday, 19 November 13
- 3. About Me Started in 2006 and based in Sydney. Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 4. We Love Joomla Who doesn’t! Photo credits: UltraLynx & PB Web Development Tuesday, 19 November 13
- 5. Small team Myself = Site architect and co-director, Martina = creative director and co-director Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 6. Lucky to have a growing team It’s awesome working with other passionates Photo credits: Flickr - notahipster Tuesday, 19 November 13
- 7. Why are we talking about this It’s awesome working with other passionates Photo credits: Flickr - BamCorp Tuesday, 19 November 13
- 8. In the past... Made mistakes, learnt the hard way Photo credits: Flickr - Rav560 Tuesday, 19 November 13
- 9. Are you a designer? What is this? Photo credits: Flickr - salforduniversity Tuesday, 19 November 13
- 10. Lost weeks of productivity and lots of money Photo credits: Flickr - gorbould Tuesday, 19 November 13
- 11. Lets avoid these situations Little bit of planning goes a long way Photo credits: Flickr - rhysasplundh Tuesday, 19 November 13
- 12. Case study: IAmInfusion.com.au Little bit of planning goes a long way Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 13. The dream Two years of product development... Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 14. The process... Well sort of a process... Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 15. 5 Easy Steps Lets get to it. Photo credits: Flickr - tolomea Tuesday, 19 November 13
- 16. Get this right If the girl friend is happy then everything else is just fine Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 17. 1. Information gathering It’s a process, get as much information as possible Photo credits: Flickr - wy_jackrabbit Tuesday, 19 November 13
- 18. Check list Get everything you can Photo credits: Flickr - puuikibeach Tuesday, 19 November 13
- 19. Design information gathering Target devices Similar sites (competition) ✤ ✤ Business company philosophy / mission statement ✤ ✤ ✤ Design Inspiration Logos ✤ Branding ✤ Corporate identities ✤ Target demographics ✤ Target market Tuesday, 19 November 13
- 20. Marketing & SEO planning ✤ Content strategy ✤ Email marketing ✤ Keywords ✤ Pay per click advertising ✤ Social media ✤ Offline marketing Tuesday, 19 November 13
- 21. Functionality and build ✤ Functional requirements ✤ Server bandwidth ✤ Administrator abilities ✤ Server resources (RAM, CPU, HDD space) ✤ Test cases ✤ User testing / UAT Tuesday, 19 November 13
- 22. 2. Wireframing Sketch out your website, draft plans Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 23. Ability to communicate Quickly and easily Photo credits: Flickr - davidkjelkerud Tuesday, 19 November 13
- 24. Engages the client Client involvement in planning phase Photo credits: Flickr - Philip Taylor PT Tuesday, 19 November 13
- 25. Tools: Balsamiq Quick and easy wireframes and drafts Photo credits: Balsqmiq.com Tuesday, 19 November 13
- 26. Tools: iPad ver. for collaboration Quick and easy wireframes and drafts Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 27. Tools: Paper and pencil Best tool and easiest tool to use... Photo credits: Flickr - Tonx Tuesday, 19 November 13
- 28. 3. Site architecture Quick and easy wireframes and drafts Photo credits: Flickr - ND Tuesday, 19 November 13
- 29. Type of content Products, blog articles, company information Photo credits: Flickr - cuppyuppycake Tuesday, 19 November 13
- 30. Card sorting Great way to engage with the clients Photo credits: PB Web Development Tuesday, 19 November 13
- 31. 4. Know your extensions Investigate what you can use according to requirements Photo credits: Joomla.org Tuesday, 19 November 13
- 32. Create a list of extensions you can use Check those extensions, ratings, reviews, compatibility Photo credits: Joomla.org Tuesday, 19 November 13
- 33. 5. Plan your build Match requirements with extensions Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 34. Prototypes Easy to build multiple Joomla sites with different extension solutions Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 35. Custom development When 7000+ extensions just doesn’t cut it Photo credits: Flickr - ronnyandre Tuesday, 19 November 13
- 36. I Am Infusions requirements Functionality and limitations Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 37. I Am Infusions requirements ✤ Low cost ✤ Low resource usage, ✤ Flexible coupon code logic ✤ Inventory control ✤ Cheap payment options (PayPal) ✤ Fast implementation Tuesday, 19 November 13
- 38. I Am Infusions requirements ✤ Basically need everything ✤ With no budget ✤ Tea canisters to take over the office Tuesday, 19 November 13
- 39. Lots of tea Being surrounded Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 40. Execution Putting it all into action Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 41. Test Prototypes User testing on prototypes to determine issues Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 42. Tested cart extensions ✤ Tested, MijoShop, VirtueMart, Magento and RedShop ✤ Martina tested out functionality and use ✤ Redshop didn’t missing functionality ✤ Virtuemart didn’t feel user friendly ✤ Magento to resource intensive ✤ Mijoshop fit the build Tuesday, 19 November 13
- 43. Results so far Since launch this year Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 44. Current position ✤ Strong and growing online sales from offline event promotion ✤ Engagement with wholesalers around Australia and the world ✤ Strong fan base via Instragram / social media ✤ Growth of new product range Tuesday, 19 November 13
- 45. What next? Plan the next stage Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 46. A website is never done Always more to do improve and grow Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 47. Start planning the next phases Always more to do improve and grow Photo credits: IAmInfusion.com.au Tuesday, 19 November 13
- 48. Next for I Am Infusion ✤ Mobile / Responsive website ✤ Additional online payment options ✤ Usability changes and improvements ✤ More product and sales information ✤ Wholesaler and distributor database Tuesday, 19 November 13
- 49. Learning resources ✤ List of other resources ✤ Planning for a website project: http://fivepaths.com/resources/planning-website-project ✤ 45 useful checklists - http://www.smashingmagazine.com/2009/06/29/45-incredibly-usefulweb-design-checklists-and-questionnaires/ ✤ Comprehensive planning guide - http://www.smashingmagazine.com/2011/06/09/acomprehensive-website-planning-guide/ ✤ Website planning & developing your website blue print -http://www.1stwebdesigner.com/ design/part-1-website-planning-developing-your-website-blueprint/ Tuesday, 19 November 13
- 50. Thanks everyone ✤ http://www.iaminfusion.com.au ✤ http://pbwebdev.com ✤ Twitter: @astroboysoup ✤ Oh I have a podcast: Joomla Beat Podcast - joomlabe.at Episode 30 - 5 steps to planning a website - http://joomlabe.at/ep30 Tuesday, 19 November 13