Commit Graph

33 Commits

Author SHA1 Message Date
Chris Hill-Scott
403e133b80 Remove the phones 2016-12-07 16:14:30 +00:00
Chris Hill-Scott
4a596c1dd2 Add a new banner for telling you about trial mode
We’ve found in research that developers have no idea they’re in trial
mode until they hit an error. And even then they don’t really know what
trial mode means.

So this commit:
- adds a message to the API integration page about trial mode
- puts it in a really yellow banner to draw attention to it
- adds the same banner to the settings page
2016-09-28 17:00:46 +01:00
Chris Hill-Scott
25829762bf Add ‘get started’ back to the dashboard
Since we’re removing the write email/write text message calls to action
from the tour, we should reintroduce them to the dashboard, for users
who are unsure what they should do next.
2016-07-01 14:00:45 +01:00
Chris Hill-Scott
1667996716 Make it clearer what Notify is for from homepage
Uses some graphic design to communicate what Notify is:

- for sending messages to lots of people
- messages can be personalised
2016-06-22 14:37:02 +01:00
Chris Hill-Scott
c41944080c Make the tour interactive
_The code for this is quite hacky and light on tests. But I’d really like to get
it in the app for the research tomorrow to see how well the feature works._

This commit changes the tour from being a set of static screens to some help
which guides you through the process of sending your first test message.

The theory behind this is that what users are really struggling with is the
concept of a variable, rather than the relationship between the placeholders and
the column headers. And like learning to program, the best way to learn is by
taking an example and modifying it to your own needs.

This means that when someone adds their first service we set them up an
example email template and an example text message template. Then there is a
guided, three step process where _all_ the user can do is send a test message to
themselves.

Once the message is sent, the user still has the example templates which they
can edit, rather than having to remember what they’re supposed to be doing.
2016-05-25 13:14:09 +01:00
Chris Hill-Scott
a6be0d0612 Show error if you try to send too many messages
https://www.pivotaltracker.com/story/show/117630691

There is a limit of 50 messages per day in trial mode. Right now, we
don’t tell you this, we just start failing your messages.

This commit adds an error message if you upload a CSV file that has too
many rows in it.
2016-04-25 10:46:38 +01:00
Chris Hill-Scott
b549b98108 Don’t lint SCSS files that have come from outside
We should (and do) keep exact copies of SCSS files that have come from
elsewhere so that we can easily upgrade them. But sometimes they don’t
always pass our linting rules, or throw a lot of warnings, which is
noisy.

This commit:
- moves such files into their own subdirectory
- tells SCSS Lint to ignore files in this directory
2016-04-13 14:30:49 +01:00
Chris Hill-Scott
0e22c9b2e0 Fix hidden trial mode link
This link wasn’t styled, therefore it had, by default, the same colour
as its background (blue).

This commit explicitly sets it to be white, so it is visible against its
background.
2016-04-05 13:44:53 +01:00
Chris Hill-Scott
47b86e70df Use SVG images for tour
SVG images will look sharper and scale more cleanly. However they are
not supported on older browsers[1]

> The <picture> element allows for fallback images when the browser
> doesn't support a specified image format.

`<picture>` is supported in the latest versions of Chrome, Firefox, IE
(Edge), Safari and Android, so all these browsers will get the SVG
version.

Older browsers will fall back to the PNG version.

[1] http://caniuse.com/#feat=svg
[2] https://css-tricks.com/a-complete-guide-to-svg-fallbacks/#fallback-svg-as-img-picture
[3] http://caniuse.com/#feat=SVG
2016-04-04 16:55:06 +01:00
Chris Hill-Scott
b9cd669439 Remove some banners which aren’t used/wanted 2016-04-04 09:25:41 +01:00
Chris Hill-Scott
eaa72074db Enhance the ‘how to do placeholders’ hint
This commit makes the ‘how to do placeholders’ box part of the tour,
with the same blue background.

It also adds some Javascript enhancement so that:
- it responds to the contents of the message template
- has a ‘show me’ link which inserts ‘Dear ((name))’ into the template
  contents textbox

We’ve found that this has helped people understnad what placeholders
are, and how to do them.
2016-04-04 09:25:41 +01:00
Chris Hill-Scott
5d873bdc45 Show a tour when users first create a service
This commit adds a 3 screen tour, similar to those used on GOV.UK Verify
and Passports.

We guerilla tested this on Friday, and it really helped users to build a
mental model of how Notify works, so that when they’re playing around
with it they have a greater sense of what they’re aiming to do. This
makes concepts like templates and placeholders click more quickly.

https://www.pivotaltracker.com/story/show/116710119
2016-04-04 09:25:34 +01:00
Chris Hill-Scott
3945889e4e Add a link to help page from the trial mode banner 2016-03-17 14:58:17 +00:00
Chris Hill-Scott
b38ae08ad6 Put some statistics on the dashboard
This commit adds two new sections to the dashboard

1. A banner telling you about trial mode, including a count of how many messages
   you have left today, which is a restriction of trial mode

2. Panels with counts of how many emails and text messages have been sent in a
   day, plus the failure rates for each

It does **not**:
- link through to any further information about what trial mode is (coming
  later)
- link through to pages for the failure rates (coming later)
- change the ‘recent jobs’ section to ‘recent notifications’
2016-03-17 14:06:12 +00:00
Chris Hill-Scott
eb3734f1d1 Give the user better error messages for CSV files
Makes uses of the additions to utils in https://github.com/alphagov/notifications-utils/pull/9

This commit strips out a lot of the complex stuff that the views and templates
in this app were doing. There is now a cleaner separation of concerns:

- utils returns the number and type of errors in the csv
- `get_errors_for_csv` helper in this app maps the number and type of errors
  onto human-friendly error messages
- the view and template just doing the glueing-together of all the pieces

This is (hopefully) easier to understand, definitely makes the component
parts easier to test in isolation, and makes it easier to give more specific
error messages.
2016-03-08 18:36:22 +00:00
Chris Hill-Scott
1e46922876 Make send the send flow generic
This commit parameterises all methods in the send view so that they can send
either emails or SMS messages.

It works out what kind of message it is sending from the `template_type`
property of the template object.

This means that the `Template` util class needs to know about these properties,
which means that this commit depends on:
https://github.com/alphagov/notifications-utils/pull/2

This commit does _not_ add tests for sending emails. The existing tests for
sending SMS still pass, but actually sending emails is outside the scope of
this story.
2016-02-24 09:23:38 +00:00
Chris Hill-Scott
db5aa0e092 Add banner back on send sms page 2016-02-23 11:24:40 +00:00
Chris Hill-Scott
17b99c9bf2 Add pages to invite, edit, and delete users
This takes the original prototype version of this page, and, using the same
fake data (ie nothing is wired up):
- adds an invite users page
- adds an edit (and delete) user page

Both these pages allow the user to set another user’s permissions.

This commit adds images for the ticks and crosses, so we have control over their
appearance.
2016-02-22 13:39:02 +00:00
Chris Hill-Scott
97304a6681 Remove ‘info’ banner type
We’re not using this banner type anywhere any more
2016-02-15 11:37:40 +00:00
Chris Hill-Scott
3f365058ef Fix problems found by SASS Lint 2016-02-08 12:02:22 +00:00
Chris Hill-Scott
26adcc64c1 Updates to ‘send SMS’ page
Based on discussion with Pete.

Make the blue banner an ‘important’ banner (copied from Register to Vote, used
because it’s not as boxy and fits on the page better).

Remove the back button because you haven’t changed any data yet. If you need to
go back you can just press back or start again.

Make the filename stand out more.

Remove the ‘download example’ link. Will need to revist the best way of doing
this.

Make text messages consistently 2/3rd width.
2016-02-04 14:06:19 +00:00
Chris Hill-Scott
48df622aba Add two steps to onboarding banner
It’s not obvious what the first steps are when you’ve just signed up.

This commit changes the banner on the dashboard to make it obvious.
2016-02-04 10:59:18 +00:00
Chris Hill-Scott
4280c21b23 Updates to send and check SMS pages
Adds a back button instead of a back link (more prominent, you’re likely to
go back on these pages if you’ve made a mistake)

Tweaks to wording
2016-02-04 10:59:18 +00:00
Chris Hill-Scott
856296df5d Updates to display of jobs
This commit:
- adds the template to the jobs page (and puts it at the top of the send SMS
  page) so that it consistently appears in the same place throughout the
  journey
- put the real data about a job on the jobs page and on the dashboard
2016-02-04 10:59:03 +00:00
Chris Hill-Scott
8d3e3e6943 Change wording on the banner
We can ignore any mention of trial/test/mode if we just talk about ‘not live’.

It also feels sensible to link through to the page where you can make that
change, rather than dig through the navigation.
2016-02-03 11:18:02 +00:00
Chris Hill-Scott
686c4127cd Various tweaks
- remove black border from banner
- make banners have internal columns
- make nav 2/3rd width, 19px text and more spaced out
- only show the ‘restricted mode’ banner where it’s needed
- rename ‘restricted mode’ to ‘trial mode’
2016-02-02 15:01:17 +00:00
Chris Hill-Scott
46db79c421 Add a new style of banner—‘tip’
This banner is meant for onboarding users and giving them prompts about what
they should do next.
2016-02-02 09:44:24 +00:00
Chris Hill-Scott
2ef1057180 Make spacing and position of banners consistent
Banners should always be the first thing on the page.

Because headers already have padding we don’t want to put padding on the
container.

So banners should also have top padding to distance then from the red bar.

They should also sit in the 3/4 column if the page has side navigation. This
commit adds a new template (`withoutnav_template.html`) which extends
`admin_template.html`. All views then extend one or the other, never the
`admin_template.html` directly. This means that `admin_template.html` doesn’t
have to make decisions about where the flash messages are displayed.
2016-02-01 13:52:46 +00:00
Chris Hill-Scott
e03813ceef Make 'API key was revoked' banner green 2016-01-26 16:26:08 +00:00
Chris Hill-Scott
6f1f514b2b Add restricted mode warning
For the hack day, we should only let developers use the platform in restricted
mode. This commit adds a banner telling them this.

Can’t get the app running locally, so fingers crossed it actually looks how
I imagine it’s going to look…
2016-01-22 11:00:44 +00:00
Chris Hill-Scott
1e0f5c27b9 Add link to delete a template
This is a link not a button because:
- it’s less prominent—delete is an infrequent action
- it’s a two-step process, and only the second part changes any data (so it has
  a button)
2016-01-14 10:59:51 +00:00
Chris Hill-Scott
85b0b4af21 Replace message_status component with banner
Message status was almost identical to banner, visually and semantically.
This consolidates the two into one component.

This means adding an extra parameter which controls whether or not the banner
has a tick (with and without a tick are the only two variations currently).
2016-01-11 14:27:31 +00:00
Chris Hill-Scott
034c70bc97 Add a banner ✔ 2016-01-05 13:31:54 +00:00