Initial mockups

[tnum]

Initial mockups;

• Proposals index #16, with filtering options
• Viewing a proposal with the options to support #17, or delegating proposal weight

[oliverbarnes]

@ThomasWeiser it would be great to get your impressions here.

The way I viewed this, btw:

git checkout mockup/basic_proposal_listings
open mockups/index.html

[oliverbarnes]

Thanks for this @tnum!

Just to clarify, I take it this is a concept mock, not necessarily tied to any of the current milestones laid down on github?

I really like the look and feel. The proposals stand out on the proposal listing, while making the actionable items clearly visible. I'd be happy to apply this styling to the current general layout and existing proposal listing.

On the flip side, I find the proposal details on the proposal page a little hard to read. Probably due to the grey background and low contrast against the text, as well as the smallish font size. Reading proposals should be as much of a pleasure as possible, specially given some of the subject matter can be a little hard to digest. A big reference for me is Medium, with regards to that and to interaction with actionable items.

I like the visibility of the author, though something about the background behind the name makes it feel like the person is more of a commenter (and others might appear next to her), for some reason. That may be from my experience using https://discourse.org, another big reference. Their Meta board is worth having a look. They show commenters and "likers" in an action bar below the posted text. I think Medium's take on showing the author might be clearer, in our case.

If you got the time, I think it'd be great to iterate on comments here and post another version that include features constrained to milestone 0.0.1, so we can implement it right away and play with it.

Then we can progress by iterating for the subsequent milestones, gradually. What do you think?

[oliverbarnes]

Looking at Medium again, I see they also have a "New story" link available on clicking on the logged in user's profile pic 👍 One thing to note though is how they also have the 'Write a story' link right there at the top, on the same level as the profile pic itself. That could work for us I think, as we want to nudge people to write their own proposals

[tnum]

Hi @oliverbarnes, yes this is a conceptual mockup, there are a few extra features not directly tied to the milestones

I agree the

font is too small, which definitely makes it harder to read on the grey background. I can focus on improving fonts/legibility. I will push the revised version to this branch.

Any further suggestions or comments appreciated. Thanks!

[ThomasWeiser]

Hey Teenum, great work! I joyfully anticipate the joining of your design with the emerging functional code from Oliver and me.

As Oliver pointed out, readability in the proposal view should be a high priority IMHO. I'm no designer at all, so please take all this with a grain of salt. Yes, grey on grey is all over the web now. To be honest, I'm no fan of this trend. Would prefer more contrasting colors.

Specifically, how about using the same background for the main proposal view as in the proposal list?

Only other thing noticed with relevance for the first feature milestone: User's name could be shown in the popup menu of the profile pic (like GitHub and probably many others).

Cheers!

[tnum]

@oliverbarnes the mockup should be more in line with milestone 0.0.1 with the suggested improvement - I have commented directly in some of the issues.

@ThomasWeiser @oliverbarnes the text should be much easier to read now (dark grey on white as opposed to grey on grey) and the username is visible in the dropdown menu.

Thanks

[oliverbarnes]

Cool, the proposal details are much easier to read now, thanks. The proposal summary makes sense, the old ember app had it too, actually. I've added it to the milestone.

We might need a few more iterations of the mockup until it works for 0.0.1, though.

Here's a list of changes, please let me know what you think.

• Delegation would need to be removed altogether (we'll revisit it as part of 0.0.2)
• We don't have the concepts of votes yet - only support. So instead of number of votes, proposals listed should have number of supports.
• I'm adding more comments about the support widget on #17
• On the unauthenticated home page the sign-up/login button should be more proeminent, I think - initially the app will have no users, so it needs to be very inviting to sign up.
• Also on the unauthenticated page: having presentation text is good, but it's all over the place now. would be important to get a nice simple layout for it, and not gray-on-gray.
• The 'Participate' header on the top left is missing the bang in 'Participate!'
• The proposal listing seems off to the right when the browser window is stretched wider.

cc @ThomasWeiser

[oliverbarnes]

@tnum and I huddled over a slack call to go over the proposed changes, and she's now working on updating the mockup

[oliverbarnes]

Looks great! I think this is ready for 0.0.1, going to merge it