UI Improvements Planning Issue : Individual tags page

[gautamig54]

Next we start with the implementation of individual tags page.

Checklist

• Divide the page into three sections(Main image and the introduction card, sidebar with map, activity cards) @gautamig54
• Adjust the main image and add the number of people following on to the right. @CleverFool77
• make an introduction card for the tag containing the subscribe and learn more options. @gautamig54
• Activity cards with new design of style guide @CleverFool77
• Show map on the sidebar and people near options @gautamig54
• Sort by name, users and people following @CleverFool77 Wait a bit
• Post a question option with dropdown @gautamig54
• Implement type dropdown containing options for all, questions, wikis and notes related to the tag. @CleverFool77
• Add related tags @gautamig54

cc : @CleverFool77

[gautamig54]

I had a few doubts regarding the design.
Not all tags have a wiki page due to which there will be no background image. What should be the design in that case?
Where should we add the related tags section?
Also, I would like to suggest to add the list of sub-pages for a parent tag here on its main page itself.
Do we need to make this as a shadow page as well??

[gautamig54]

@jywarren @CleverFool77 @gauravano @SidharthBansal
Let's get started on this. Thanks!

[CleverFool77]

Ohk. Seems like the Issues ave been divided here. So I'll close the earlier issue that I made then.
Thanks !!

[CleverFool77]

The new style guide design looks good but there are many features that we are yet to place in it Like gautami mentioned in the comment.

I had a few doubts regarding the design.
Not all tags have a wiki page due to which there will be no background image. What should be the design in that case?
Where should we add the related tags section?
Also, I would like to suggest to add the list of sub-pages for a parent tag here on its main page itself.
Do we need to make this as a shadow page as well??

[gautamig54]

@CleverFool77 I have assigned the tasks to us. You can change it according to your preference. Thanks.
And let's wait for @jywarren comment on the doubts we have.

[CleverFool77]

Hi @gautamig54 do the assignment alternativily. So that it's easier to work and it's faster.

[gautamig54]

I'll do it. I will also write the detailed tasks and divide accordingly.

[gautamig54]

I have updated the issue.
@CleverFool77 I was thinking whether we really need to sort the activity using name or people. I mean we are already dividing the tag's activity into types like wikis, questions and notes. We can utilize this space for displaying the related tags.
What do you say?

[CleverFool77]

I'm not sure regarding sorting @gautamig54 . But that yeah your point does makes sense. As we already distinction based on wikis, questions and notes.
Lets wait a bit for @jywarren.
Hi @gautamig54 I added nearby user search option to map on add map part. As Both of them are related and addition of map looked very small task.
Thanks !!

[CleverFool77]

Hi @gautamig54 Are we going to do this in shadow route or in similar route.
According to me, The new UI won't break everything as it was happening in Questions page. As the new UI was totally different from earlier. So we needed shadow route before to test.
But here the new design is just a refined and better way of earlier. The position is almost same with some changes to nav tabs to dropdown. The different UI cards. That's it.
So should we do this in shadow route or do changes above earlier one ?

[gautamig54]

I am not sure about the shadow page. We are dividing the page into 3 sections. You think that might affect the current page?

[CleverFool77]

As you can see, the page right now is already divided into two sections. Just divide the second section into columns for cards and maps.
col-10 and col-2 maybe ?
https://publiclab.org/tag/air-quality
What do you say ?
And we can have sorting by views and likes instead of places ?

[CleverFool77]

Hi @gautamig54 Lets wait for @jywarren regarding the shadow or original route.

[gautamig54]

Maybe we can manage on the original page itself. Let's wait for @jywarren's views.

[jywarren]

I think given the state of the tag page now (pretty bad) we might as well do this without a shadow page, and that might mean we do things that are going to disrupt, later in the process (like we try to order it so that the things we do first will be an improvement on the current page, rather than do something that'll need a fix later on and leave the page in a broken state) Make sense?

Not all tags have a wiki page due to which there will be no background image. What should be the design in that case?

I think we can make the background grey, unless you can think of something else. There are examples of pages in the style guide with no lead image, but then the top box would appear differently. So, let's go with light grey? What do you think?

As for the text if there's no wiki page, we might have text like this page has no summary; _click here to add one_ by making a wiki page -- this may need some more refinement but does that make any sense? Or should it say more simply Add summary but the longer text as a tooltip?

Where should we add the related tags section?

Perhaps this could go where See people near is in this screenshot? The Style guide will have to be refined to make the various uses of this space more clear, perhaps.

Also, I would like to suggest to add the list of sub-pages for a parent tag here on its main page itself.

Would it go in the left sidebar?

sorting options

In default view we are seeing all Notes, Questions and Wikis mixed, sorted by recent updates. The sorting area would be different for different pages, so perhaps here we'd offer created | updated | likes ? What about commented? we can show 2-3, and have a more with more options added if we need?

[jywarren]

Exciting!!!!! This will be great. We can ask people for input as we go and the new auto screenshots feature can also let us work on this a lot in a set of PRs even before merging. In fact, it should be possible for PRs to be opened against other PR branches, so that we can see the page evolve in the screenshots before doing a larger merge... what do you think?

[jywarren]

Or we can progressively merge PRs into the master branch. Either way. Whatever works for you all!

[gautamig54]

I think given the state of the tag page now (pretty bad) we might as well do this without a shadow page, and that might mean we do things that are going to disrupt, later in the process (like we try to order it so that the things we do first will be an improvement on the current page, rather than do something that'll need a fix later on and leave the page in a broken state) Make sense?

This is a good idea. We can start of with improvising the main image display together with the main tag card. This is more like an enhancement.

I think we can make the background grey, unless you can think of something else. There are examples of pages in the style guide with no lead image, but then the top box would appear differently. So, let's go with light grey? What do you think?

Light grey sounds good!!

Regarding the sub topics, we can add it on the sidebar. Maybe below the related tags?

[CleverFool77]

Hi @gautamig54 Are you starting off with first part then ?

[gautamig54]

Yea, I am beginning with the first part

[gautamig54]

So we are not leaving any marginal space for the image?

[CleverFool77]

You'll be leaving col-2 for map right ?

…

On Thu, Jun 13, 2019 at 11:19 PM Gautami Gupta ***@***.***> wrote: Yea, I am beginning with the first part — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#5890?email_source=notifications&email_token=AGLS6STPHT5O5ES6KZVHHXDP2KCCFA5CNFSM4HXV2FR2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODXUQK6A#issuecomment-501810552>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGLS6SVMUSO6NKTS6MTPN2LP2KCCFANCNFSM4HXV2FRQ> .

[jywarren]

I think we can remove it, thanks!

…

On Mon, Jul 8, 2019 at 3:27 PM Gautami Gupta ***@***.***> wrote: Do we need the format toggle options in the new design or we can remove it? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#5890?email_source=notifications&email_token=AAAF6JZYHA3NTQZDVY4E2Z3P6OIIFA5CNFSM4HXV2FR2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODZODHUA#issuecomment-509359056>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J2NXSRUTCY46FO7UYTP6OIIFANCNFSM4HXV2FRQ> .

[gautamig54]

@jywarren here in the design there are a few drop-downs whose purpose I am not able to understand. Like in "Post a question", what will be there in the drop down?
The ellipsis beside the types dropdown and in the sidebar beside the "see people near"?

[jywarren]

In Post a question I thought it might go to different types of posts. But if we implement the popup template menu shown here:

Then the dropdown there wouldn't be necessary, and we could just say Post. What do you think?

The other two, I think we can skip, since we have one in the top card. They were just other suggested places to "tuck away" or hide extra functionality!

[gautamig54]

@jywarren , So do you want a modal kind of pop up to select the template from? We can even have it as options in drop down. And yes, if we are going with giving user options to select their purpose, we have to change to "Post".

[grvsachdeva]

Hey @gautamig54, we can use dropdown but this design #5890 (comment) looks really great, so can you try to implement it?

[CleverFool77]

Hi @gautamig54 Are you working on the post button ? and using modal and all ?

[gautamig54]

Hi @CleverFool77! I have been a bit busy lately. I am working on the remaining tasks on the tags page. I will push the changes very soon.
Sorry for the delay!

[CleverFool77]

Hi @gautamig54 If you want, I can do the task of Posting a Question ? What do you say ? As I can see you still have some tasks left in other pages.

[gautamig54]

What is suppose to be in the dropdown of posting a question?

[CleverFool77]

Cool. You work on this, I'll start with dashboard then. In post question dropdown, There should be a modal which would let us choose template. @jywarren had added one draft design for it on style guide. Thanks !!!

…

On Sun, Aug 4, 2019 at 10:17 PM Gautami Gupta ***@***.***> wrote: What is suppose to be in the dropdown of posting a question? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#5890?email_source=notifications&email_token=AGLS6ST3JAKPXSV3ZMN2T4TQC4BY3A5CNFSM4HXV2FR2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3QFLZY#issuecomment-518018535>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGLS6STF2LBT3RV2FA7QFI3QC4BY3ANCNFSM4HXV2FRQ> .

[gautamig54]

@gauravano @asquare14 I have a few doubts regarding the options available for the post.

• question
• story or a project. Now the story will be a post with tag as blog-submission where as a project can be a simple post. Which one to choose?
• Issue, will it be a post with tagging as issue-brief? And where is the template of an issue for I think it is a feature and not in the code.

[CleverFool77]

Hi @gautamig54 First of all , I don't seem to completely understand your question though, But I'll try to explain whatever I understood.
We need to have the options like we have in our dashboard for Share your Work , In this dashboard we have options such as Notes, Wikis and Questions. etc -

In here, what we are suppossed to have is the modal for choosing between notes, qikis and questions I guess.

cc: @gauravano @asquare14

And what you wrote about Issue/story/project and stuff - Instead doing it for Wikis Note and Questions like we have in dashboard would be good.

And Here one of the main thing to notice is that we won't have be directly posting but rather we should have tag attached for that particular tag as This is posting either Note or Question on that tag. SO You need to make sure that tag is attached.

Like this which we currently have for posting question for particular tag -

[gautamig54]

I implemented what I understood @CleverFool77. I have attached the tags and they working correctly. Except in issues I added the tag, issue-brief-tagname. I think this is how it works.
For others I did the same as you suggested.

[gautamig54]

Also, @CleverFool77 I was thinking, if we can have a separate issue for correcting the view for the mobile view or tab view. What do you think?

[CleverFool77]

Hi @gautamig54 Is there need to create more issue ? we can just add this in checklist of follow up fixes and bugs. As If we'll keep on creating issues, we will have lots of issue for every bug. So its better to just checklist them in one existing issue. Cool.

[jywarren]

Sorry to reply slowly here, but i hope it helps clarify - the original dashboard with the dropdown of options to post is intended to be replaced by the modal (showing /before/ redirecting to the editor, because which editor depends on the selection made) because the modal gives us more space to explain what the different types are for. As it is now, newcomers seeing the dropdown may not understand easily what each "type" of post is for, so the modal gives us some space to explain this. Could this work? The modal could be its own partial template. We'll just want to be sure it renders nicely in mobile.

…

On Thu, Aug 8, 2019 at 2:01 PM Lekhika Dugtal ***@***.***> wrote: Hi @gautamig54 <https://github.com/gautamig54> Is there need to create more issue ? we can just add this in checklist of follow up fixes and bugs. As If we'll keep on creating issues, we will have lots of issue for every bug. So its better to just checklist the in one existing issue. Cool. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#5890?email_source=notifications&email_token=AAAF6J4ELSFTANVA3S6L3ITQDPHBZA5CNFSM4HXV2FR2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD32ZXDQ#issuecomment-519412622>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J535HT4GKGYXOQZLQDQDPHBZANCNFSM4HXV2FRQ> .

[CleverFool77]

Cool. @gautamig54 has updated this modal feature in her pr.
cc: @jywarren

[jywarren]

I think we're almost done here too, just need to ensure sorting works! I crossed out a couple we're not doing.

[jywarren]

@CleverFool77 were you interested in wrapping up the sorting issue, or at least breaking it out into a new issue under the same milestone that is a bit more thoroughly documented? Then we can close this out!

[jywarren]

I believe this is almost complete, except for this issue which I'm going to link to! #6307

Thanks all!