Design for next iteration of copyright site

[hannahkane]

See the doc for details

• [x] Wireframes - get approval from @Melechuga and @ScottDowne
• [x] Mockups

Aiming to complete the design by the end of this week, so let's work towards quick turnaround on feedback, and narrow the scope as needed. Use existing models for the call tool UX, as we can.

[natalieworth]

@hannahkane @Melechuga Have the first round of rough wireframes with some questions in the Red Pen doc here: https://redpen.io/p/oge34c752bef306b8c I'm going to post/ share for the other designers to review too!

[natalieworth]

I'll be on PTO the next 2 days, but I will leave all my assets in here EOD today https://drive.google.com/drive/folders/0B20-0lpP23c0eGdrN1JWZHpNMlk?usp=sharing

Benchmarks for reference: https://www.battleforthenet.com/?call=1#bftn-action-form https://5calls.org/

[natalieworth]

Outstanding questions/ issues:

• [x] For the landing page, do we want to call out the deadline to call on the 'Timeline' section?
• [x] Should we switch 'Draft proposal' and 'Opinions' on the timeline section so it's sequential?
• [x] On the 'learn more' page, should we provide a bit more context after the "What's being debated header?
• [x] Finalize the flow and CTA's/ buttons on the pop-up modal based on what needs to be included in the survey.
• [ ] Are we still using share progress for the social share?
• [x] What content are we gathering from the survey. Could even be as simple as this: https://5calls.org/issue/recX4tGPF6RQsgd41 (scroll to bottom)
• [ ] Need a social share image.

cc @hannahkane @Melechuga @beccaklam

[Melechuga]

Thanks for this, @natalieworth! The timeline isn't really clear as to if the progress is going up or down, when in fact we are closer to the end of the process than the beginning. Is it possible to make this horizontal at all, like the example? Either way, the "Draft Proposal" and "Opinions" cannot be switched, as the opinions are about the draft proposal 😄 Agree with Tais' comment that the heading "What's being debated" followed by the personas is unclear. Is this a matter of switching the placement of the header out or...?

[hannahkane]

Thanks for the very good start on this, @natalieworth. My two cents on your questions, though @Melechuga is the decider on most of this:

• For the landing page, do we want to call out the deadline to call on the 'Timeline' section? I'd suggest we remove the timeline and replace with a deadline to call. I think that's the most important part of the timeline to convey.

• Should we switch 'Draft proposal' and 'Opinions' on the timeline section so it's sequential? If we keep the timeline, I'd say yes, but see above point.

• On the 'learn more' page, should we provide a bit more context after the "What's being debated header? In the redpen, I suggested a copy change to the header. I think "How does this impact me?" would address the storytelling question Taís raised.

• Finalize the flow and CTA's/ buttons on the pop-up modal based on what needs to be included in the survey. In the redpen, I suggested removing the survey. I think it gets in the way of our primary CTAs.

• Are we still using share progress for the social share? Yes, though Scott points out it has a difficult localization workflow. I don't know of any other options.

• What content are we gathering from the survey. Could even be as simple as this: https://5calls.org/issue/recX4tGPF6RQsgd41 (scroll to bottom) I suggest removing the survey. I'm not sure we'll be able to act on the information we get from it, and we should be able to get useful metrics from the call tool itself. Scott made a good point in the redpen that we should consider the survey for a future enhancement.

• Need a social share image. Can we identify one during the UI phase of this, which should be coming up next?

@Melechuga - if you have time to go through the redpen comments again today, that would be rad. I think we're very close to answering all of the outstanding questions, but there's still some debate in the redpen comments. Ideally we can finalize the wireframes by EOD tomorrow, so we can move on to UI and wrap the design phase by the end of the week.

[hannahkane]

@natalieworth - @Melechuga and I just discussed. I think we're clear on just about all of the decision points. Can you and I find time to talk through everything tomorrow? Probably easier than resolving all of the redpen comments.

[natalieworth]

Updated wireframes based on the feedback from yesterday are in here https://redpen.io/p/qxf1a097aa18134c73 cc @hannahkane @ScottDowne @Melechuga

[hannahkane]

@natalieworth - looks fantastic! I think we can move to UI now.

[natalieworth]

Not to confuse things @hannahkane but I also have a quick alternate version based on the feedback in the redpen here https://redpen.io/p/jm78b588f0cbc7dd15

It gets rid of the issue I was having with the amount of content/ asks on the modul and would allow the script text to be larger and scrollable (which would more beneficial for desktop and mobile users). It would add another page though.

cc @Melechuga @ScottDowne @beccaklam

[hannahkane]

Thanks, @natalieworth. I like the alternate version a lot better. @ScottDowne - do we need to ask Josh the question about whether we'll know when the person has finished the call?

[natalieworth]

I like this version best too!

[natalieworth]

I've started the UI here: https://redpen.io/p/gdc9521eded436818e

The current wireframes are here: https://redpen.io/p/jm78b588f0cbc7dd15

I'm going to suggest pausing the remainder of the UI/ wireframes until we hear back from Scott and the other dev on the functionality of the call tool—as this will ultimately affect the final wireframes and how the site functions. Once we get back if it's possible to incorporate some of these things, then I'll finish up the designs.

Main outstanding questions for the call tool are:

• [ ] Are we able to know when the user disconnects their call?
• [ ] Is it viable with our time remaining to implement the "Connecting now..." to a specific MEP?

@hannahkane @Melechuga @ScottDowne @lovegushwa @beccaklam

[ScottDowne]

Currently the tool does not send back any call status to the front end, so no, we are not able to know when the user disconnects or finishes the call.

I'm not sure what the current status around displaying the person you're calling info to the user is.

[natalieworth]

@hannahkane when you're back, are you able to confirm if we are using share progress for this?

[natalieworth]

@lovegushwa @beccaklam @hannahkane @ScottDowne @Melechuga Since we're not able to know when the user disconnects their phone, I've added 2 alternative options for the flow of the call tool here https://redpen.io/p/jm78b588f0cbc7dd15 Option 1: Share icons would be static on all the pages Option 2: If we have an instructional format on the call tool page, the share could be last on the page.

Also, I'd suggest we make the MEP connection/ photo/ name a P2 since we're not sure on the status of it right now.

[Melechuga]

@natalieworth Thanks! I like Option 1, as it's more streamlined. But if it makes sense to have the clear instructions in Option 2, I'm not opposed. I'll leave it to the UX folks to make a call.

[hannahkane]

@natalieworth - to your question about Share Progress - question for @ScottDowne - do we have an alternative to Share Progress?

[TheoChevalier]

@natalieworth could you share with me the latest redpen URL? Looks like this one has been deleted, and that’s what I gave to localizers https://redpen.io/p/gdc9521eded436818e

[natalieworth]

Hi @TheoChevalier ! https://redpen.io/p/xwcac539ecebd42e66 A few things have changed from the last one, including there is some additional instructions on this page https://redpen.io/hpfc7e88cf158b1227 and we shortened the button text to "Call now" since you suggested the localized languages get quite long for those. Let me know if there's any questions/ issues!

[natalieworth]

@TheoChevalier The sentence structure changed slightly on this page too (https://redpen.io/aqd0c3134fcf294dc6)

[TheoChevalier]

@natalieworth Thanks! Updated the strings locally, I guess I can now expose the call script strings + sharing strings too? Or are there changes ongoing? Just left a comment on the sharing page, but otherwise everything looks great :)

Will put the new redpen link in Pontoon resources, just ping me if the link changes 🔗

[hannahkane]

@natalieworth - I think we can call this done, right?

@TheoChevalier - latest redpen is here

[natalieworth]

@hannahkane Yep! Done!