Progress report: Continuum Teachers

ICON LEGEND

Nothing yet

In Progress

Client Action

Complete

The following is a tentative punchlist on what needs to be done in this project in chronological order. I will be updating this document as-needed so that it stays up-to-date and we can stay on the same page about what's being waited on and what's being done.

PHASE 1: Homepage & interior page static design

Content document & sitemap

Going back through the content document in our shared Google document to further refine and clarify next steps.

Wireframes design

Using the outline & content from our content document, I will create wireframes of all the pages. Wireframes are basically black & white modular layouts without design or actual content. This helps us get clear on the structure of the pages before a lot of work goes into the actual design of the pages (saving us on development time).

Splashpage design (desktop)

Using the previous steps (and the answers to our questionnaire) as guides, I will create a detailed static homepage design in Sketch (desktop layout first) using our fave video

Continuum logo

A hand-made script logo reminiscent of the "aloha" script I used for this Hawaii Visitors Bureau poster. Flowy, cursive and beautiful is what I am envisioning.

Questionnaire responses from our teachers

Link to questionnaire for them to fill out: http://bit.ly/2j18w3V

Art screens

Send me all those art screens you were talking about at high-resolution. Put them in a folder, zip that folder up and send them to me via wetransfer.com

Up-to-date PDFs?

Are these the most up-to-date PDFs that you’ll want on the Vision, Mission, History page? https://app.box.com/s/ucney2xx3lmx5lyfw72klj5qafhgyt03

5-10 Teachers in database

5-10 teachers info filled out in our Teachers Spreadsheet along with high-resolution photo of them (at least 1 megabyte in size)

Interior page template (desktop)

I use the visual principles we established with the homepage to lay out our sample interior page (to be used as a template for most of the interior pages of the site).

Desktop & interior page templates responsive in tablets/smartphones

This step shows you how the content will re-flow on smaller screens. It's very important to see how I will create the design to adapt to different screen sizes.

Create style document

I will put together a style document that will show fonts & colors in their native habitat showing headlines, body copy, pullquotes, button styles, etc.

CLIENT SIGNOFF

Any client edits are made, then after client signoff, we move onto the next step.

PHASE 2: Designing rest of pages

Design of rest of interior pages in Sketch

Making sure all the content fits in a nice way into our online environment, adding new design elements, if needed, per the content on the page.

Design of advanced pages

Design of the calendar pages in list view & the month view; also, designing a way to filter/search teachers and offerings before implementing the technology & programming.

CLIENT SIGNOFF

Any client edits are made, then after client signoff, we move onto the next step.

PHASE 3: Bringing design to life & making pages responsive

Make static pages interactive

I translate the static Photoshop mockups of the homepage and interior page template into a language that the web can understand (HTML5/CSS3). I also add interactivity to buttons, hyperlinks, navigation items and any other elements that want to come to life. I also browser test the pages in the main browsers (Explorer, Firefox, Safari, etc.) to make sure all relevant browsers are translating the pages to look right.

Fit to all screen sizes in HTML5/CSS3 (responsive)

I design alternate layouts that work for all the varying screen sizes your website will be viewed through. (Over 50% of website traffic these days views the web through mobile devices.)

CLIENT SIGNOFF

Any client edits are made, then after client signoff, we move onto the next step.

PHASE 4: Creating all final website pages

Filling in the blanks ...

Now that all of the structure and design is done and signed off on, I fill in all of your content, which will take on the look & feel of the design we've already created.

Programming of month-view calendar & filter functionality

Now that the structure is complete, we can bring in the programmer to make the more complex pieces work. Our calendar list view will already be implemented, but our monthly calendar view will need to be programmed to pull in data from our database.

Overall website edits (content, imagery, layout)

Now that all the content is filled in, I will go through with a fine-toothed comb first to make sure everything looks pixel-perfect; then you will go through with your comb. (Make sure to look on your tablet and smartphone in addition to your desktop screen size and to share with co-workers, friends, anyone who can help catch any final edits before we go live.)

Add commenting feature to all articles

This will allow visitors to comment on articles while keeping your site free of spam comments.

Add social media share icons to all pages

This will allow visitors to share any page on their preferred social media platform.

CLIENT SIGNOFF

Any client edits are made, then after client signoff, we move onto the next step.

PHASE 5: Finalizing, testing, optimizing, launching

Optimize all imagery

I will make sure all imagery is fully optimized so page load speed is the fastest it can be.

Run all pages through HTML5/CSS3 validator

To make sure that all code on your website is compliant with the W3C (World Wide Web Consortium)

Customize 404 error page

A 404 error page is the page visitors get when they get a dead page on your site. I'll design this page so it matches the look of your site.

Add favicon & analytics sitewide

A favicon is the image that shows up beside a browser's URL window on your site. I will create a square icon using your logo to go there. Visitor analytics are added to your website so we can view usage data (how many visitors come to the site daily, which pages they go to, what links they click, etc.).

Create title & description tags for all pages

The title and description is created for each page of the site (which is helpful for search engine optimization (SEO), but does not take the place of a full SEO campaign). I will be condensing content from each page to make the title/description.

FINAL CLIENT SIGNOFF

Final client signoff brings us to the live launch of the site.

Set up hosting account

I will send you a link to begin your monthly payments for the hosting/CMS fee.

Readying the transfer

Now the website is ready for liftoff. I will set up your SSL certificate and point your domain name to the new hosting. (Could take up to 48 hours, but tends to happen within an hour.)

NEW WEBSITE LIVE!

301 redirects

I will insert code to redirect visitors from the old website pages to equivalent pages on the new website (so no one hits a dead end if they try to go to an old page).

Client training

I teach you how to use your website to make edits/updates yourself through the CMS and how to add/edit blog posts.