New Candidate Conversation Viewer UI Design

[ddfridley]

Some people are really not happy about this UI design. It's been enough to get the project to this point, but we really need a more generally attractive UI design.

Here is an example with all the candidates slots filled: https://undebate.herokuapp.com/schoolboard-conversation

Here is an example with only 3 candidate slots filled: https://undebate.herokuapp.com/san-francisco-district-attorney

One way that people get to this is by clicking on a link at ballotpedia: https://ballotpedia.org/Chesa_Boudin

Other ways are through links in email campaigns, and facebook/twitter links.

We are open to anything, and would love to do A/B testing on different designs to figure out what works. One word about the standard business practice of designing for the demographics of your target market - that's great for business but that's the opposite of what's needed for democratic discourse. We need to design the inclusive user interface, the unbiased user interface.

For a new UI design, we don't need it in any particular format. It can be pencil on paper, power point (my favorite), or any of the many UI prototyping tools. Whatever is fastest for you, that gets the idea across. We do need help with specifically what colors, shapes, fonts, and such to use.

Constraints:

1. We do need the UI design to convey how speakers change. In the current design you see that the windows rotate to move the next person into the center window. It's doesn't have to be like this, but we need a description of how speakers change, and we need the design to consider that change the speaker is not seamless, there may be flashes and discontinuities when we change video streams. (that's why we are moving things around). But they don't have to rotate. Also, we can put a still image on top momentarily while the video is loading underneath.

2. We have the preference to having all the candidates on screen in some way. This matches how you see the race on ballotpedia's page, and if you were in the audience at a debate you would see all the candidates on stage - though only one might show up in the big display behind the candidates. But if you want to challenge that preference with A/B testing - go for it.

3. We think it needs to all be above the fold - like on a television. We don't want people to have to scroll down while someone is talking to see something else. So you need to think about how it's going to be on a desktop, but also how it's going to be on a smarphone in both landscape and portrait mode.

4. the aspect ratio (width to height) of the videos shouldn't be changed, but this app will get run on difference viewports and smartphones with very different aspect ratios.

5. The browser won't let us play back video with audio until after the user presses a button. That's why we have the begin button. But we can play back silent video before that, or we can load images.

6. The current design can support from 2 candidates to 7 candidates - but they all use the same format - so there's blank space when there are only 2 candidates. It may be better to have different layout's for different numbers of candidates. And sometime there are more than 7 candidates.

As for user feedback, I've heard people say it's too formal, they don't like the way things move on the screen. I've heard that we need to include more content on the page like the Election and Race.

I encourage talking to the people around you, everyone is a target user of this.

Here is the viewer feedback we have received:

• A very needed platform for candidates making the most of small budgets.
• looks like great candidates
• Excellent idea, camera angles could improve. More information to the subject to help them with camera set up.
• Great way to provide spotlight on the personal side of the candidates.
• Simple. To the point. Love this.
• I like this. It allows you to see the candidate and get to know a little about them
• No
• Would appreciate more specific and tougher questions about candidates' views on the job they're running for, and their relevant experience. 
• I think questions like "what was your first job" are basically filler - they're not useful when I'm deciding who to vote for.
• This is excellent! I'd love to see a couple more substantive questions asked, but this is a very useful.
• The transition animations when switching focus on who is speaking was slow a bit awkward.
• Camera angle seemed like everyone was looking down at a laptop, notebook, or smartphone. Use of a camera of an iMac at eye level or higher might be better.
• Some more specific questions would be great..but great idea for an app
• Pretty cool!
• Great!
• This is great!!
• Great concept. Now I'm not voting for faceless strangers.
• Yes
• My name is aleem and i want be next attroney General
• More policy, less pandering
• Great!
• I was amazed at how my opinion flipped from my first impressions, and how candidates seemed much more human than their canned speech introductions of themselves. Nice job!
• I like it

[ddfridley]

This is being covered by #41