Our Process: Website Design & Development

Transcription

1 Our Process: Website Design & Development HOW WE BUILD YOUR VIRTUAL HABITAT The process for building your website is a lot like building a new home. Like any good architect, this means asking questions to understand your needs. Once we get an idea of what you want, we then draft a blueprint that reflects your current goals and anticipates future growth. We begin by sending you our web survey to help figure out the project s size and budget (Are you building a cozy cottage or Xanadu?), as well as how each room (page) is going to be used (Is this a playroom or a master suite?). Our clients have found it a useful starting point to think through what kind of website they want and need. It s an easy document to complete (some even say it s fun), and it should only take minutes of your time. Based on the info collected via the web survey and a follow- up conversation with you, we ll create a proposal that describes the scope of the project, the budget, and the timeframe. If that looks good to you, then we get to work! PHASE 1: DEFINITION If you re building a home, you need a floor plan. How many doors will the house need? Where will your guests enter? How do they move from room to room? In the Definition phase, we determine how visitors will interact with your site. We get the ball rolling with a kickoff session to review the project details, approach, expectations, and a timeline with you. We also work to gain a deeper understanding of your goals for the website and your target audiences. Finally, we discuss the look and feel of the site and the key homepage and subpage features. Based on this discussion, we ll provide a suggested site outline that will determine the final scope and navigation of the new site. Depending on the size and complexity of your site, we may also develop: A content guide with recommendations for prioritizing your messages and creating web- friendly copy A sitemap that shows your outline in a convenient, visual format (similar to a flowchart) Wireframes, which act as a blueprint for the structure and functions of the site (a basic visual mockup of where text and images will appear on your site) An audience profile / user- experience (UX) map showing how different visitors will navigate the site and convert into leads / new customers

2 2 An initial mood board to demonstrate the general design direction, including example images, patterns, color palettes, and font styles To see examples of what a site outline, sitemap, and wireframe looks like, check out the appendix at the end of this document. PHASE 2: DESIGN & CONTENT ESTABLISHING THE LOOK OF YOUR NEW WEBSITE As we begin to establish your website s look and feel, things get a bit more fun. Now, we re picking out the equivalents of countertops, flooring, and paint colors. We design websites not just for readability and usability, but for visual appeal as well (which, research shows, actually enhances both of the aforementioned). During the design phase, you ll see: Homepage and subpage design examples to allow all participants to agree on the fundamental design and navigation Additional mockups of other pages with specific functions or features such as a news / blog page, event listing, custom contact form, photo gallery, product detail, shopping cart, etc. Selection and treatments for your site s visuals. These may be from existing stock photo resources or created from scratch by the Hile Creative team, and may include custom photography, illustration, infographics, animation, or video Based on your feedback, we collaborate with you to refine each of these. (We generally provide up to two sets of iterative revisions to make sure we get it just right.) CORRALLING YOUR SITE S CONTENT This is also the time to start collecting all the content for the site, including both text and visual assets like charts, graphs, and downloadable documents like whitepapers, product manuals, and brochures. Our copywriter can work with you to develop copy from scratch, or serve as an adviser / editor to help you establish the overall tone of the site. The copywriter will also review your text for basic search engine accessibility and ease of navigation. PHASE 3: DEVELOPMENT Time for construction! We ll build your website on our test server, where it will only be viewable by you and Hile Creative (until it goes public). Once the site is built and your content has been uploaded to the test site, you ll have time to review it to make sure everything is delivered as expected. After approval, we ll transfer the site files to your live server and provide complete and unfettered administrative access to you or another user authorized by you. It s your website you should hold the keys.

3 3 CMS TRAINING Most of our sites are built with the WordPress Content Management System (CMS), which gives you the ability to make quick and easy updates to your site s content. We can provide an onsite or online training session to demonstrate the WordPress CMS; the training includes a PowerPoint presentation that you can share with your staff to demonstrate the administration of your unique site. MAINTENANCE Finally, like a home, a website does require some ongoing maintenance. We provide our clients with a maintenance agreement to perform periodic tasks, including software updates, technical support, additional training, editing content, or creating new site graphics. These are important to keep your site compatible with new technologies and secure it from malicious hackers. ADDITIONAL SERVICES Depending on your budget and strategic priorities, we can offer enhanced website services, including: Mobile Compatibility: Your website will be viewable on mobile browsers. If your audience is visiting your site on the go, we can build a responsive or fluid site that will adapt the layout of the site s content based on browser window size. If your mobile visitors will use your site to perform specific interactions that may be different from desktop or laptop users, we can build a separate, mobile- specific version designed for maximum usability on mobile devices. Search Engine Optimization (SEO): When we build any WordPress site, we build a site that is search engine- friendly. This means that the code follows best practices, the URL structure and navigation allow for Google and other search engines to read the site, and each page auto- generates a unique page title. For clients in a more competitive space, however, we offer advanced SEO, including keyword research, optimization of headings, developing an internal / external link- building strategy, and more. To learn more about our services, call or Dave Hile (President) at dave@hilecreative.com. You can download our Web Survey at design Hile Creative gave our website the professional punch it needed. They understood our vision and created a brand that appeals to both business and home office users. Lauren Caris, Marketing Director, Humantech, Inc.

4 4 APPENDIX EXAMPLE SITE OUTLINE 1. Home 1.1 About Us Our Team Careers 1.2 Services Service Service Service Products Product Product Product Contact Us 1.5 Sitemap EXAMPLE SITEMAP

5 5 EXAMPLE WIREFRAME