Coder Social home page Coder Social logo

prototypes's Introduction

GCWeb

Build Status devDependency Status

canada.ca theme

Experimental Links gh-pages

prototypes's People

Contributors

mikayla-jl avatar patlaj avatar steve-h avatar marybethbaker avatar

Watchers

 avatar James Cloos avatar Lisa Neo avatar Roy Ballantine avatar Dave Knight avatar  avatar

prototypes's Issues

Can't get report a problem to work

@shawnthompson Help! I copied the code snippet for Report a problem from this page http://servicecanada.github.io/GCWeb/home-fr.html into this page in this repo: http://neoinsight.github.io/prototypes/experimental/contacts-en.html

It looks pretty good but it isn't opening up a dialog box when you check an item, so I must have missed something. Can you advise please? Have not yet made the change to the French page yet.

I am making a page with an obvious problem (see the first item under the Benefits contacts) to see if I can get participants to use the button. Thanks.

Canada.ca Consultation Landing Page Template

  1. Overall - Template needs focus.

Lots of key info on left plus "Share your thoughts" box on right. As a user - not sure what to look at first. Also not sure if this information was to replace the methods available in Join in section. When you're on a mobile device this right hand box will also place itself after the text, so the quick access is lost on mobile, which for Health Canada is 52% of users.
We also didn't want this form to highlight/promote the "web form" format. Data collection from this format is much more manual and not the preferred way to collect user feedback. Unless there is a built-in database this is not an efficient method to use when receiving thousands of submissions.
However, a simplified version of it might be more useful in the documentation so that users can access the consultation from any materials they are viewing.

  1. We like the tombstone type info at top - i.e. Current status, date consultation opened and when it will close, and short plain language description of the consultation.

Current status section should include the following status options: Open, Closed, Closed - Report Available.
Currently users have to scroll through a lot of info to find out what the key sections are on this page. Recommend using a table of contents (that you could expand/collapse or redirect) type listing of the key sections on this page - then a user could quickly scan & know what the key sections are and link right to them. Would be more mobile friendly as well.
Example - Under the tombstone type info, a table of contents type listing of the other key sections would be helpful:
Join in - how to participate
Who is the focus of this consultation
Themes to spark ideas
When and where
What we are hearing
Related information
Contact us

  1. Key section labels

Where did the titles for the key sections came from? Have they been tested? Some of the labels were not intuitive to those who reviewed.
As a user coming to a consultation I want to know these basic things:
What is the consultation about?
Why are we doing this?
Who should participate? (i.e. can I participate? is this for me?)
When is the deadline?
How do I participate?
What happens next?
Recommendation - be more clear with section titles. Recommend revising the following:
Consultation Name is already in the title at the top of the page. No need to repeat that. The section under current status should be the WHY we are doing this, the description is ok but the section title should be about the WHY not consultation name again.
Who is the focus of this consultation - Assuming this means target audience? Current wording sounds like who the consultation is going to be about, not who may be interested in it or who the target audience is.
Themes to spark ideas, etc. - what does this mean? Are you testing all those titles? Are these plain language (we avoid colloquial terms) and what will they look like in French? Like the suggested content but the titles are not representative of the information proposed for that section.
Related information - related to what? why would a user need to look at this to complete their task? Is this necessary?
Issue: There is no area to link to published final reports. Obtaining approvals to release an interim report are highly unlikely, it's even a challenge to release final reports.
Recommendation - Replace What we are hearing section with final report posting What We Heard so users can access that quickly. They are currently very difficult to find when they are posted.

  1. Order of key sections on the page

Current order is:

Join in - how to participate
Who is the focus of this consultation
Themes to spark ideas
When and where
What we are hearing
Related information
Contact us

Do we want to have people joining in before they know if they are eligible to participate?
Recommendation - Put the "join in" type info lower down - but use a table of contents style list - so they can see it right away and go there quickly (i.e. if they've been to the page before and now want to participate or if they already know they want to participate). Also the in person When and where section should be included/merged in the same section as Join in. They are ALL ways on how to participate and should be together.
We would recommend something more like:
What is the consultation about
(Why are we doing it)
Who should participate
How to participate
When and where
Themes to spark ideas
What we heard
Related information
Contact us
5. Really like the inclusion of template tips in the template.

This will be very useful for depts - and will keep things consistent. Would also be helpful (a nice to have) if tips could reference relevant section of Content & IA Spec for more info. You don't want people thinking that they no longer need to consult the specs because they think that all info is in the template.

  1. In H1 it shows "CONSULTATION NAME" in all caps

Recommendation - Don't do this. It will make people think that part of the H1 must be in all caps. Use proper capitalization in the template to ensure consistency with the Style Guide.

  1. Template tips: Creating a page title

Really like the template tips for the H1 heading. Instructions are clear & concise.
8. Plain language

Make sure plain language is used
Noticed some language that is definitely not plain language - but might be because this is a draft page? For example, under "Share your thoughts", under "About you" one sentence reads,
"All reports will include totals of the answers below, so that answers cannot be attributed to particular people." I'm not sure what this means and words like "attributed" are not simple or common.

  1. Finally on the template itself, we can submit a GITHUB ticket, although there might need to be increased support from PCO to make it a priority to have the template drafted and made available in WET.

Need Canada.ca footer in prototypes

@shawnthompson We are using these prototypes for usability testing (and sometimes prototypes in the gcweb repo), so it would be much preferred if the new Canada.ca footer was available to use in the pages we create.

Have talked to @steve-h about doing this - can you advise on whether you will be updating the gcweb repo that this was originally forked from? It was created following the advice from Codefest you posted here: http://shawnthompson.github.io/jekyll-presentation/2016/02/15/gh-pages.html

Or maybe you could add instructions to that post about how to keep the WET in protoyping repos up to date?

Thanks!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.