You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@beam.apache.org by Agnieszka Sell <ag...@polidea.com> on 2020/12/14 14:33:38 UTC

Website Revamp update & navigation for documentation page

Hi Folks!

Last week we had an 8th sprint review of the Beam Website Revamp project.
The summary can be found here [1] and presentation from the meeting here
[2]. During the meeting we discussed following UI designs:

   1. Documentation page updates (added expandable section with runners).
   2. Blog updates (updated blog cards).
   3. Powered By Apache Beam (created icons for commercial use cases and
   open source projects).
   4. Updated top navigation (added edit button and search bar).

You can check all these designs in a presentation [2]. Additionally, I'd
like to ask you to take a look at the UX design for the left navigation on
the Documentation page (attached). How do you like it? Your feedback will
be more than helpful :)

One more thing is that we received some messages from people asking about
the accessibility aspects of the revamped page – thank you for that! I'd
like you to know that while redesigning the page we're following Google
guidelines concerning accessibility. Let me know if you have any questions
about it!

Kind regards,

Agnieszka

[1]
https://docs.google.com/document/d/1CqssBpRt1EjpV0nCBaS9WGaGHt_4stKXbwMz9gYfmwc/edit
[2]
https://docs.google.com/presentation/d/1asXPHDtW8Y4oHfCZ8QWsPf9mTVlTaxCHRMniiKPWfWQ/edit?usp=sharing



-- 

Agnieszka Sell
Polidea <https://www.polidea.com/> | Project Manager

M: *+48 504 901 334* <+48504901334>
E: agnieszka.sell@polidea.com
[image: Polidea] <https://www.polidea.com/>

Check out our projects! <https://www.polidea.com/our-work>
[image: Github] <https://github.com/Polidea> [image: Facebook]
<https://www.facebook.com/Polidea.Software> [image: Twitter]
<https://twitter.com/polidea> [image: Linkedin]
<https://www.linkedin.com/company/polidea> [image: Instagram]
<https://instagram.com/polidea>

Unique Tech
Check out our projects! <https://www.polidea.com/our-work>

Re: Website Revamp update & navigation for documentation page

Posted by Griselda Cuevas <gr...@apache.org>.
Ack, thanks Ahmet for the suggestion.

I think it's important to bring attention to this discussion separately, so
I am going to for the thread to start one specific about the navigation
design.


On Mon, 14 Dec 2020 at 17:49, Ahmet Altay <al...@google.com> wrote:

>
>
> On Mon, Dec 14, 2020 at 4:32 PM Griselda Cuevas <gr...@apache.org> wrote:
>
>> Hi Ahmet, adding response inline.
>>
>> A question about the content. Design adds items for use cases, do we have
>>> existing content that fits into that template?
>>>
>> Yes, the content will be curated from the use cases we got presented at
>> Beam Summits. We are tracking who has given permission to do this in Jira:
>> BEAM-11225 <https://issues.apache.org/jira/browse/BEAM-11225> [1]
>>
>
> Nice!
>
>
>>
>> Re: left navigation on the docs page. The fonts here are more readable to
>>> me and the search feature is great. One question, the current version has
>>> hierarchical and collapsible items on the left navigation. Would that still
>>> be possible. IMO visual grouping, and hiding detailed items makes the
>>> documentation easier to navigate.
>>>
>>
>> This is the point we would like to hear feedback on, the proposal is to
>> remove the full detail in the left navigation and leave the hierarchy view
>> on the right navigation, which appears on the right when you click on a
>> topic. Doing this will allow us to keep the left navigation organized and
>> focused on the high level topics, hoping to make the experience smoother
>> and neater for people and do not overwhelm them with so many
>> topics/subtopics.
>>
>
> Got it. Having a simplified left nav, and a more detailed right nav make
> sense to me.
>
> My _very personal opinion_ is that the left nav is useful, and the right
> nav is usually cluttered and has duplicate information. For example in this
> page (
> https://beam.apache.org/documentation/transforms/python/overview/#element-wise),
> left nav has richer and collapsible information. Right nav has partial
> information. Somewhat of an opposite example in this page (
> https://beam.apache.org/documentation/programming-guide/#triggers). I
> wonder if we can have a single nav menu in a more elegant way?
>
>
>>
>> For context, experienced UX and UI designers are proposing these changes
>> and have optimized for a better discovery and troubleshooting experience,
>> hence the recommendation.
>>
>> [1]
>> https://issues.apache.org/jira/browse/BEAM-11225?jql=project%20%3D%20BEAM%20AND%20text%20~%20%22permission%20use%20cases%22
>>
>>>

Re: Website Revamp update & navigation for documentation page

Posted by Ahmet Altay <al...@google.com>.
On Mon, Dec 14, 2020 at 4:32 PM Griselda Cuevas <gr...@apache.org> wrote:

> Hi Ahmet, adding response inline.
>
> A question about the content. Design adds items for use cases, do we have
>> existing content that fits into that template?
>>
> Yes, the content will be curated from the use cases we got presented at
> Beam Summits. We are tracking who has given permission to do this in Jira:
> BEAM-11225 <https://issues.apache.org/jira/browse/BEAM-11225> [1]
>

Nice!


>
> Re: left navigation on the docs page. The fonts here are more readable to
>> me and the search feature is great. One question, the current version has
>> hierarchical and collapsible items on the left navigation. Would that still
>> be possible. IMO visual grouping, and hiding detailed items makes the
>> documentation easier to navigate.
>>
>
> This is the point we would like to hear feedback on, the proposal is to
> remove the full detail in the left navigation and leave the hierarchy view
> on the right navigation, which appears on the right when you click on a
> topic. Doing this will allow us to keep the left navigation organized and
> focused on the high level topics, hoping to make the experience smoother
> and neater for people and do not overwhelm them with so many
> topics/subtopics.
>

Got it. Having a simplified left nav, and a more detailed right nav make
sense to me.

My _very personal opinion_ is that the left nav is useful, and the right
nav is usually cluttered and has duplicate information. For example in this
page (
https://beam.apache.org/documentation/transforms/python/overview/#element-wise),
left nav has richer and collapsible information. Right nav has partial
information. Somewhat of an opposite example in this page (
https://beam.apache.org/documentation/programming-guide/#triggers). I
wonder if we can have a single nav menu in a more elegant way?


>
> For context, experienced UX and UI designers are proposing these changes
> and have optimized for a better discovery and troubleshooting experience,
> hence the recommendation.
>
> [1]
> https://issues.apache.org/jira/browse/BEAM-11225?jql=project%20%3D%20BEAM%20AND%20text%20~%20%22permission%20use%20cases%22
>
>>

Re: Website Revamp update & navigation for documentation page

Posted by Griselda Cuevas <gr...@apache.org>.
Hi Ahmet, adding response inline.

A question about the content. Design adds items for use cases, do we have
> existing content that fits into that template?
>
Yes, the content will be curated from the use cases we got presented at
Beam Summits. We are tracking who has given permission to do this in Jira:
BEAM-11225 <https://issues.apache.org/jira/browse/BEAM-11225> [1]

Re: left navigation on the docs page. The fonts here are more readable to
> me and the search feature is great. One question, the current version has
> hierarchical and collapsible items on the left navigation. Would that still
> be possible. IMO visual grouping, and hiding detailed items makes the
> documentation easier to navigate.
>

This is the point we would like to hear feedback on, the proposal is to
remove the full detail in the left navigation and leave the hierarchy view
on the right navigation, which appears on the right when you click on a
topic. Doing this will allow us to keep the left navigation organized and
focused on the high level topics, hoping to make the experience smoother
and neater for people and do not overwhelm them with so many
topics/subtopics.

For context, experienced UX and UI designers are proposing these changes
and have optimized for a better discovery and troubleshooting experience,
hence the recommendation.

[1]
https://issues.apache.org/jira/browse/BEAM-11225?jql=project%20%3D%20BEAM%20AND%20text%20~%20%22permission%20use%20cases%22

>

Re: Website Revamp update & navigation for documentation page

Posted by Ahmet Altay <al...@google.com>.
On Mon, Dec 14, 2020 at 6:34 AM Agnieszka Sell <ag...@polidea.com>
wrote:

> Hi Folks!
>
> Last week we had an 8th sprint review of the Beam Website Revamp project.
> The summary can be found here [1] and presentation from the meeting here
> [2]. During the meeting we discussed following UI designs:
>
>    1. Documentation page updates (added expandable section with runners).
>    2. Blog updates (updated blog cards).
>    3. Powered By Apache Beam (created icons for commercial use cases and
>    open source projects).
>
> A question about the content. Design adds items for use cases, do we have
existing content that fits into that template?

>
>    1. Updated top navigation (added edit button and search bar).
>
> You can check all these designs in a presentation [2]. Additionally, I'd
> like to ask you to take a look at the UX design for the left navigation on
> the Documentation page (attached). How do you like it? Your feedback will
> be more than helpful :)
>

Thanks a lot for sharing these.

Re: left navigation on the docs page. The fonts here are more readable to
me and the search feature is great. One question, the current version has
hierarchical and collapsible items on the left navigation. Would that still
be possible. IMO visual grouping, and hiding detailed items makes the
documentation easier to navigate.


>
> One more thing is that we received some messages from people asking about
> the accessibility aspects of the revamped page – thank you for that! I'd
> like you to know that while redesigning the page we're following Google
> guidelines concerning accessibility. Let me know if you have any questions
> about it!
>
> Kind regards,
>
> Agnieszka
>
> [1]
> https://docs.google.com/document/d/1CqssBpRt1EjpV0nCBaS9WGaGHt_4stKXbwMz9gYfmwc/edit
> [2]
> https://docs.google.com/presentation/d/1asXPHDtW8Y4oHfCZ8QWsPf9mTVlTaxCHRMniiKPWfWQ/edit?usp=sharing
>
>
>
> --
>
> Agnieszka Sell
> Polidea <https://www.polidea.com/> | Project Manager
>
> M: *+48 504 901 334* <+48504901334>
> E: agnieszka.sell@polidea.com
> [image: Polidea] <https://www.polidea.com/>
>
> Check out our projects! <https://www.polidea.com/our-work>
> [image: Github] <https://github.com/Polidea> [image: Facebook]
> <https://www.facebook.com/Polidea.Software> [image: Twitter]
> <https://twitter.com/polidea> [image: Linkedin]
> <https://www.linkedin.com/company/polidea> [image: Instagram]
> <https://instagram.com/polidea>
>
> Unique Tech
> Check out our projects! <https://www.polidea.com/our-work>
>