participedia / frontend

DEPRECATED - see https://github.com/participedia/api/ instead
MIT License
2 stars 2 forks source link

Homepage Results/Sort by/Explainer - Designs for Review #838

Open jesicarson opened 6 years ago

jesicarson commented 6 years ago

@scottofletcher @plscully @dethe Here are a couple of options for the homepage results.

Generally, how do we feel about listing "results" instead of "pages"?

Specifically:

Option 1 shows our usual treatment, but adds "Sort by" to the far right. Also adds "First, Previous, Next, Last" text with arrows. Currently there's no way to skip to the end of the results, not sure if this matters - thoughts?

Option 2 adds an explainer under the "all" tab (as discussed in this issue: https://github.com/participedia/usersnaps/issues/182). Also shows the "Sort by" menu open and positioned above the line, on the same hierarchical level as cases/methods/orgs (open menu has same visual treatment as clicking your avatar and seeing profile/sign out options). @scottofletcher Are these the options we want to sort by: Date submitted & Last edited ?

Option 3 shows the pagination at the bottom left after the results, back to an earlier design that was never implemented.

OPTION 1 home - results - sort by 1-100

OPTION 2 home - results - sort by 2-100

OPTION 3 home - results - sort by 3-100

plscully commented 6 years ago

@jesicarson Thank you, this is very helpful! I like Option 2 the best, although the explainer doesn't look as nice as the rest of the page. I think we need something like this, but it looks a bit squeezed in. And my sense is that it is not only because Option 2 needs two lines to include it.

jesicarson commented 6 years ago

Good point, thanks @plscully. I'll keep working on how the explainer can look. I'm not convinced it fits in that position after all, as we also display text results of searches there, ie, in the space below the tabs, this search displays : 1 result of 1 for "democ" (page 1 of 1)

Also thinking we can get away with just arrows << < > >>, rather than the words "first, previous, next, last" and a sort button maybe (taking cues from Google):

screen shot 2018-06-14 at 8 00 12 am

screen shot 2018-06-14 at 8 08 15 am

screen shot 2018-06-14 at 8 09 14 am

scottofletcher commented 6 years ago

I like Option 2 as well but I still think we need to reword the 'explainer' to fit with our "new" approach -- include words/phrases like 'wiki', 'crowdsourced', 'community created content', etc. I'm not sure the "stories" really fits here anymore since, like Wikipedia, we (ideally) want descriptive accounts with secondary/academic sources to back up the information. Our guidelines make this pretty clear and I think Pat and I have been pretty consistent in including it in our communiques with collaborators/coapplicants/RAs

jesicarson commented 6 years ago

I think the conversation about language, tying into overall vision for Participedia is important and should be continued. Lets find a way to do that... Maybe a focused discussion at the next all team meeting?

But for now I'm just going to focus on the design side :)

Another couple versions (i guess this would be options 4-7) showing the explainer for "all" and "case" above the tabs, in the same type size as headings in the case narrative. Its a lot of real estate, but maybe important as that was some of the most emphatic feedback - what is this thing??!!

OPTION 4 (all) home - explaner 1 - all- option 4

OPTION 4 (case) home - explaner 1 - case- option 4

OPTION 5 (case) home - explaner 1 - case - option 5

OPTION 6 (case) home - explaner 1 - case - option 6

OPTION 7 (case) home - explaner 1 - case - option 7

scottofletcher commented 6 years ago

Pat and I talked I've actually come around the the "A global community...etc." tag-line that you, Paolo, and I made up like over a year ago :)

As for the new mockups I like the ones w/explainers, (not necessarily the wording -- we should stick to the wording our tagline uses: public participation) but we can discuss that later I also like having results rather than pages I'll leave the nitty-gritty design details up to you and amber (although I'm most partial to option 7 -- what would it look like if the vertical paragraph line was red?)

plscully commented 6 years ago

@jesicarson I agree that you should focus on the design and not worry about the text.

jesicarson commented 6 years ago

Thanks for the feedback, that's great. Will have Amber take a look at the designs next time we chat.

dethe commented 6 years ago

I know I'm late to this party, but…

I like option 2. For option 3, many (most?) sites put pagination above and below the results and I see no reason why we wouldn't do that too.

For the drop-down to sort by date submitted vs. last edited, do we want to add options for direction as well, so that folks can choose to sort oldest-newest or newest-oldest? Will we need that or am I overthinking things?

I like the button to jump to the last page of results, and maybe that's the solution for getting to oldest results if it is needed.

jesicarson commented 6 years ago

Thanks @dethe! Good point, I added pagination to the bottom of the page in the design guidelines #853.

Regarding directionality of sorting, that would be a @scottofletcher question :)

Regarding design, when Amber reviewed these, she suggested that our feature tour / tool tips #624 would negate the need for permanent explainers. Once it is implemented, you all can test it and see if you agree.

scottofletcher commented 6 years ago

@jesicarson @dethe Would be nice to have directionality since it would cut out a step but I'm fine being able to sort by date and then using the button to jump to the last page of results. Whatever you think would look best design-wise. For example, some websites will have a drop down with directionality in the selections (ie. date ascending, date descending, name ascending, name descending) while some will just have the basic selections in the drop-down menu (date, name) and then an arrow you can click to sort by ascending (⬆️) or descending (⬇️). Personally, I find the drop down + arrow less confusing than a drop down with a huge number of selections. That being said, we already have the download button (downward arrow above a line) which could confuse things.

jesicarson commented 5 years ago

More requests for a permanent explainer on the homepage. See: https://github.com/participedia/usersnaps/issues/274

I think we should implement option 4, but to keep things simple maybe not change the explainers for case/ method/ org tabs (just leave the main "Participedia is" explainer permanently above the tabs).

The other thing, @dethe, is that Andrea didn't provide any mockups for the feature tour, so I can't show people what it would be like - do you have it accessible to take a few screenshots by any chance?

scottofletcher commented 5 years ago

@plscully not sure about 'participatory politics' - I think "public participation and democratic innovation" better captures what we're about and the terms are broad enough that we wouldn't need the "all shapes and sizes" part

scottofletcher commented 5 years ago

Email from Pat: "OK with me to use public participation and democratic innovation".

Final text: "Participedia is a collaborative effort to document public participation and democratic innovation around the world." ça va?

@jesicarson where is this text kept? I don't see it in this Doc https://docs.google.com/document/d/10rSFF1n3sEAfcPlfWlEkEQxvZE3fr-8WR-jwaJEejsk/edit

And I agree with not changing the explainer on each of the tabs because 1) Jaskiran and I are working hard to make titles less ambiguous (ie. you can pretty much assume what a case is from a title like "Citizen Participation in the 2015-2019 Strategic Plan of Kadikoy, Turkey"), and 2) if people are curious about definitions, I'm sure they'll seek out the 'About' or 'Help' pages.

jesicarson commented 5 years ago

The text is in the copy deck (under About and Footer): https://docs.google.com/document/d/1eUVXSBHN_QqR5O_MCNHpiplAAr51K3EM5yOo8w05I5k/edit#

I would keep it as is, and (if you must) add "and democratic innovation" to the end:

Participedia: A global community sharing knowledge and stories about public participation and democratic innovation

Or, if you're going to change anything, take a cue from Wikipedia and add: "...that anyone can edit" :P

scottofletcher commented 5 years ago

Ok, so we're going to scrap the case/method/tool/technique/org explainers except for those on the About page and in this doc?

And actually that last point is good but I still think the "sharing knowledge and stories" leaves out 1) the collaborative nature of the project (ie. I can share my story or my knowledge but it's still mine, I'm the 'owner'), and 2) the documentary aspect (knowledge and stories are documented vs delivered persuasively (as most students/academics are used to)).

jesicarson commented 5 years ago

The explainers for all the things are going to be in a few places - on the about page, on the quick submit page and on the FAQs under the help & contact menu.

Re: tag line wording - I think “community” is important. And “stories” are personal and welcoming. Adding “collaborative” could be interesting. At any rate, why are we thinking of changing it now? So far, people seem to like the wording we all decided on last year, they just want to see it more prominently displayed on the home page.

scottofletcher commented 5 years ago

All good points! I'm going to mull this over a bit so we get the right balance.

The need for change is due to the overwhelming number of people that don't seem to understand what PPedia is. I met numerous people at the NCDD Conference who had gone to our site but didn't understand what it was about. Some people thought cases were scheduled events; others thought we had led the events; others thought they were articles in the academic sense of the term (ie. not collaborative) etc. The second I tell them we're "like Wikipedia but for public participation and democratic innovation" they get it.