6
DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / dbushmakingmail.com WEB SITE DESIGN AND DEVELOPMENT PROCESS Information Gathering / Analysis Input: o Interviews with clients o Mails and supporting docs by client o Discussions Notes o Online chat o Recorded telephone conversations o Model sites/applications etc. Output o Work plan o Cost involved o Team requirements o Hardware-software requirements o Supporting documents o Approval Questions to ask: o Purpose o Goals o Target Audience o Content Planning / Specification Building Input: o Reports from analysis team. Output: o Complete requirement specifications to individuals and customer/customer's representatives, responsibilities, timelines and costs, client goals, target audience Modules of site o Layout, site navigation, dynamic parts of site o Interactive forms, ecommerce, flash, etc.

Web Site Design and Development Process

Embed Size (px)

DESCRIPTION

Web Site Design and Development Process - http://www.daryabushmakin.com/

Citation preview

Page 1: Web Site Design and Development Process

DARYA A. BUSHMAKIN, MBAFacebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare

(603) 689 – 4513 / dbushmakingmail.com

WEB SITE DESIGN AND DEVELOPMENT PROCESS

Information Gathering / Analysis Input:

o Interviews with clientso Mails and supporting docs by cliento Discussions Noteso Online chato Recorded telephone conversationso Model sites/applications etc.

Outputo Work plano Cost involvedo Team requirementso Hardware-software requirementso Supporting documentso Approval

Questions to ask:o Purposeo Goalso Target Audienceo Content

Planning / Specification Building Input:

o Reports from analysis team. Output:

o Complete requirement specifications to individuals and customer/customer's representatives, responsibilities, timelines and costs, client goals, target audience

Modules of siteo Layout, site navigation, dynamic parts of siteo Interactive forms, ecommerce, flash, etc.

Site Mapo List of all main topic areas of site, sub-topics, if applicable.

Access To Servers And Build Folder Structure o FTP host, username and passwordo Control panel log-in information

Page 2: Web Site Design and Development Process

DARYA A. BUSHMAKIN, MBAFacebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare

(603) 689 – 4513 / dbushmakingmail.como Database configurationo Any languages or frameworks currently installed o Required software and resources (stock photography, fonts, etc.)

Design Input:

o Requirement specification. Output:

o Site design with templates, images and prototype. Customer comments, feedback and approvals can be communicated. Web designer will create one or more prototype designs for web site (usually a.jpg image) Wireframe and design elements planning

o Where visual layout of website begins to take shape

Development Start with a base template Lay out main sections and content Begin carving up HTML/CSS by inserting major sections (main <div>s) for header, footer and

content area. Begin adding text and image content. Elements such as interactive contact forms, flash animations or ecommerce shopping carts are

implemented and made functional during phase. Develop and test special features and interactivity. Fill with content. Test and verify links and functionality.

Content Writing Input:

o Designed template. Output:

o Site with formatted content. There are professional content developers who can write industry specific and relevant content

for site. Message, amount of copy, nuances of language, tone, etc.

Launch, Testing and Delivery Input:

o Site, requirement specifications, supporting documents, technical specifications and technical documents.

Output:

Page 3: Web Site Design and Development Process

DARYA A. BUSHMAKIN, MBAFacebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare

(603) 689 – 4513 / dbushmakingmail.como Completed application/site, testing reports, error logs, frequent interaction with

developers and designers. Complete functionality of forms or other scripts An FTP (File Transfer Protocol) program is used to upload web site files to server Web designers offer domain name registration and web hosting services Confirm all files have been uploaded correctly and site continues to be fully functional Marks official launch of site, as it is viewable to public Integration testing Stress testing Scalablity testing Load testing Resolution testing Cross-browser compatibility testing (IE, Firefox, Chrome, Safari, Opera, iPhone, BlackBerry, etc.) W3C Validation (HTML, CSS)

Promotion: Be sure client is satisfied with product and all contractual obligations have been met (refer to

project charter). A closed project should leave both and client satisfied, with no burned bridges. Provide documentation and source files Get client to sign off on last checks, provide contact information for support and officially close

project Maintain a relationship with client (checking in a month down road to make sure everything is

going smoothly is often appreciated).

Maintenance Output:

o Updated application, supporting documents to other life cycle steps and teams. SEO (Search Engine Optimization). Ongoing promotion Technical maintenance Content management & updating Site visit activity reports Staff training and mentoring

Considerations: Often times, clients change their minds in the middle of the process. Some clients want to see ready made templates rather than a customized design. Many of the steps above intersect and are not meant to be chronological.

Page 4: Web Site Design and Development Process

DARYA A. BUSHMAKIN, MBAFacebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare

(603) 689 – 4513 / dbushmakingmail.comHelpful Resources

6 Phases of the Web Site Design and Development Process - http://www.idesignstudios.com/blog/web-design/phases-web-design-development-process

A 6-Step Process for Producing a Website - http://sixrevisions.com/web-development/a-6-step-general-process-for-producing-a-website/

A Comprehensive Website Planning Guide - http://www.smashingmagazine.com/2011/06/09/a-comprehensive-website-planning-guide/

Design Process - http://www.vanseodesign.com/work/design-process/ Following A Web Design Process - http://www.smashingmagazine.com/2011/06/22/following-a-

web-design-process Gathering Information for Website - http://www.totaltravel.com/media/check-list.pdf Guide to Creating Website Information Architecture and Content -

http://www.princeton.edu/communications/services/docs/IAguide2.pdf How to Build a Website -

http://webdesign.about.com/od/beforeyoustartawebsite/p/build_website.htm Our Website Development Process - http://www.web-eze.com/process/website-development-

process.html Planning and information gathering - http://www.ineonova.com/s1a13/web-design-project-

phases/1-planning-and-information-gathering.html Six Phases of Web Site Design and Development Process -

http://www.idesignstudios.com/faq/process/ Starting Out Organized: Website Content Planning Right Way -

http://www.smashingmagazine.com/2010/03/17/starting-out-organized-website-content-planning-the-right-way/

Systems development life-cycle - http://en.wikipedia.org/wiki/Systems_Development_Life_Cycle

The Complete No-Nonsense, Step-by-Step Guide to Designing Websites - http://www.webdesignfromscratch.com/design-process/web-design-process/

The Website Development Process - http://www.draydesign.com/website-development-process.htm

Web Design Questionnaires, Project Sheets and Work Sheets - http://www.smashingmagazine.com/2010/11/26/web-design-questionnaires-project-sheets-and-work-sheets/

Web Development Life Cycle - http://www.macronimous.com/resources/web_development_life_cycle.asp

Website Development Process - http://www.attitude.net.nz/website_development_process.html