Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improving how Dask looks on the web #220

Open
jacobtomlinson opened this issue Feb 15, 2022 · 61 comments
Open

Improving how Dask looks on the web #220

jacobtomlinson opened this issue Feb 15, 2022 · 61 comments

Comments

@jacobtomlinson
Copy link
Member

Hey all. I just wanted to provide an update on the progress made by the working group thinking about Dask's branding, websites, visual identity, etc. We will add more updates to this issue as things progress.

Coiled has provided some design resources for taking a high level look at Dask's websites, logos, colour schemes, etc. To make the best use of this resource @AdiReske, @jsignell, @mrocklin, @jrbourbeau and I have been meeting with Adi's team to talk about how we can improve things.

This effort started with a look at how Dask's various websites are performing in terms of getting the right information in front of folks. We have a bunch of different "foo.dask.org" Sphinx sites for the various subprojects under Dask. We also have a landing page at dask.org, a blog at blog.dask.org and the Dask dashboard. All of these web pages exist for different reason, are built in different ways and are often maintained by different folks. One big goal of the working group is to try and improve how Dask performs on search engines when folks are looking for ways to scale Pandas, NumPy and the PyData ecosystem. The way things are today aren't doing us many favours. We had an expert deliver some updates at the last Dask Community meeting which you can find summarised in these slides.

image

To improve this we are looking at building a new website for Dask which will hold non-documentation content as well as refreshing the documentation as a whole (#170).

The other task we've been working on is thinking about Dask's branding. This was started in #135 and #140 where we looked into things like colour schemes, diagrams, charts, etc.

The working group has rebooted those efforts as part of the holistic look at Dask's identity on the web and we are now exploring things like a logo refresh, colour pallettes, etc. Ideally we want to get to a point where the designers can give us enough structure that those of us (including me) who work on things like the Dask dashboard can apply colours and layouts that fit with the rest of Dask.

The first step on this activity has been to explore updating the Dask logo and I wanted to share some options that we are considering here. Ultimately the decision will be down to the working group but feedback is always welcome. These logos represent incremental change, evolutionary change and revolutionary change. You can read more about the thought process behind this here.

image

image

Once we've made some decisions here we will move on to addressing the goals of #135 where we can explore colours that we can use throughout Dask and iconography that members of the Dask community can use to build new diagrams that fit with our style.

@ncclementi
Copy link
Member

Thanks for putting this up @jacobtomlinson, I'm adding here some extra options that were brought up in one of the meetings.

  • For the case of the Parallel logo, make it fit in a hexagon shape.
  • Other possible combinations

Screen Shot 2022-02-15 at 2 26 23 PM

Screen Shot 2022-02-15 at 2 24 16 PM

Screen Shot 2022-02-15 at 2 24 37 PM

@hayesgb
Copy link

hayesgb commented Feb 16, 2022

I really like the parallel computing logo. I have mixed feelings on the lowercase vs uppercase.

From the recording, there was some interesting conversation about upper vs lowercase. I have a preference for the upper case. Thoughts?

@jcrist
Copy link
Member

jcrist commented Feb 16, 2022

One of my biggest pet peeves is people that write dask in all caps, so my preference is for the lowercase (or title case like "Dask").

@mrocklin
Copy link
Member

I share the pet peave about people upper-casing DASK in communication, however I think that we shouldn't use the logo in order to solve that problem. That feels like the tail wagging the dog a little. Aesthetically I like the upper-case. The letters fill out the space a bit better to my eye. That's totally subjective though.

@jcrist
Copy link
Member

jcrist commented Feb 17, 2022

The only reason why I mention this is that everytime I correct the spelling of Dask to someone, they mention that the logo is all uppercase and that's why they spell it that way. Seems like an easy thing to get right now if we're thinking of changing the logo.

@jsignell
Copy link
Member

I tend to agree with Jim that the logo being all caps leads people to think it's an acronym. This is definitely subjective, but I also think the lowercase feels more approachable and friendly.

I have been thinking about it and I really do like the simplified/single color wings. If it's not too much, I was wondering if we could see an all lower-case dask with the single color wings?

In my mind some of the good things about the wings are:

  1. They don't look like any other logos
  2. They work really well in single color on tshirts with dark or light backgrounds
  3. The color goes well with a black "dask" word for cases where the style of the word is out of our control (I'm mostly thinking of github)
  4. People already associate the logo with Dask. (I know this is kind of unfair to the other logos, but it is a real pro)

@jacobtomlinson
Copy link
Member Author

jacobtomlinson commented Feb 17, 2022

I agree it would be nice to see mockups of the other logos with the lowercase. I also wonder if we could have a titlecase mockup too, perhaps with the "as" in "Dask" stylized a little more.

I'm not a huge fan of the "evolution" logo, for me it is a close call between the "wings" and "parallel computing".

I agree with all of @jsignell's points about why the wings would be good to keep.

Things I like about the "parallel computing" one are:

  • It more symbolically represents what Dask does
  • It fits neatly into a hexagon, and hexagonal stickers on laptops are HUGE
  • It is fresh and represents a new chapter for Dask
  • It is more colourful

A couple of negatives might be:

  • It looks a little generic
  • It is visually similar to the AWS EC2 logo

As I say I'm very on the fence about which I like best.

@jacobtomlinson
Copy link
Member Author

I also think any of the options here are an improvement over what we have today. This is exciting!

@AdiReske
Copy link

Hi, Thank you for all the feedback. I've asked the designers to do another revision as per @jsignell . It feels like most people are happier with the lower case option and the rectangles icon. https://www.dropbox.com/sh/35iykmtyiz7qf1t/AACHr60Ssl2NwdCccGjD8FCYa?dl=0

@martindurant
Copy link
Member

I would also vote for keeping the sails/wings, sorry. I find the rectangles generic, especially in the coding world. I think having something does that not fit a typical hexagon is a good thing!

@jsignell
Copy link
Member

I love this one!!

image

@mrocklin
Copy link
Member

I like both the evolution and parallel computing logos. I think that Dask could use a more modern image. I also want to give a +1 to this comment from @jacobtomlinson

It is fresh and represents a new chapter for Dask

I'd like for us to think about Dask as dynamic and changing, and not as static with past decisions. This applies to technology choices (I've been urging people to revisit old decisions/constraints) and I think that it should apply visually as well. We're all going to have a bias for the familiar. I think that we should prioritize not for existing users, but for future users who aren't yet bought in to the old design.

@mrocklin
Copy link
Member

It feels like most people are happier with the lower case option and the rectangles icon

FWIW I'm seeing two in favor of lower case, two in favor of upper case, and one asking to see title case.

@martindurant
Copy link
Member

We're all going to have a bias for the familiar.

I'm not sure that's fair! Some might have a bias for "new" even when it's not warranted.

@mrocklin
Copy link
Member

You're right, I shouldn't have said "all". But in general people have a strong bias for the familiar.

Changing logos has a long history of pretty much everyone not liking the change because it's familiar, and then once it happens people connect pretty strongly to the new logo.

So yeah, I didn't mean to say anything about folks here in particular, just about humans and this process in general.

@ian-r-rose
Copy link

My two cents: I like the "evolution" logo. It rhymes with the older logo, but does look fresher. I also agree with @jsignell that the lower-case text looks friendliest and is least likely to be confused for an acronym.

The "parallel squares" looks a touch generic to me, and is perhaps a bit too similar to xarray:
image

@mrocklin
Copy link
Member

If folks like podcasts, I recommend listening to this 99 Percent Invisible podcast on making marks and logos

https://99percentinvisible.org/episode/making-mark-visual-identity-tom-geismar/

@mrocklin
Copy link
Member

Oh wait, no, I think that it was this episode: https://99percentinvisible.org/episode/negative-space-logo-design-michael-bierut/

@mrocklin
Copy link
Member

I just showed the slide decks to a friend who is not in our space for neutral feedback. General takeaways:

  • Doesn't like the combination of the uppercase DASK with the block font, specifically when combined with the rectangles logo because it feels too industrial. "Looks like Maersk or some other large logistics mega-company"
  • Likes the wings, "feels tech and modern" especially with the newer futura font combination
  • Rectangles seems approachable. Wings seems "elevated" / "silicon valley looking"
  • Evolutionary logo looks like "retail tech", interpret it as "paper flipping"
  • Curious about lower-case with the futura font and with other logo options

Don't ask me to interpret most of that (I don't know what paper flipping means :) ). I did find it interesting to ask people outside of our space their opinion. I wouldn't over-rotate on these views. I do recommend that folks present this presentation to other folks to get their opinion. It's a fun ride 😄

@jakirkham
Copy link
Member

Agree with what Ian said above ( #220 (comment) ).

Evolution is a nice touch up.

Too many things in the ecosystem with squares/cubes/etc.. Would rather skip this.

Also ok with wings (either as-is now or touched up).

Have we taken into account color blindness when deciding colors?

@GenevieveBuckley
Copy link
Collaborator

Very cool!

I like both Wings and Evolution a lot. I really like the colour scheme in Evolution, that's a nice one. I don't feel any different emotions based on which way "up" the shapes go, although perhaps other people might.

I don't like Parallel. The shapes feel very generic to me, like they could apply to many different companies. The shapes in the other options feel more dynamic to me, and more recognizably unique for branding purposes.

It's always fun to see parts of what the designers are doing, thanks for sharing a peek into the process.

@jacobtomlinson
Copy link
Member Author

Have we taken into account color blindness when deciding colors?

Yeah in one of the follow ups above there is an "accessibility colours" option that the designer put together when we raised colour blindness as an issue.

@jacobtomlinson
Copy link
Member Author

Hey folks! I thought I’d share the latest from the Dask web presence working group.

A quick reminder of our goals:

  • Make Dask easier to find on the web
  • Rank better on Google for important keywords like “scaling python”
  • Grow our user community by attracting more folks to use Dask
  • Give Dask a consistent and beautiful look/feel across websites, blogs, documentation, dashboard, etc

To achieve these goals we are starting with the foundations of Dask’s branding, the logo. Then the overall brand/look/feel for Dask. Then mock up websites and things.

At this point, we have a recommendation for the logo and also a stylescape.

Logo

Let’s start with the logo. As we shared earlier in this thread we experimented with iterating a little on the logo, evolving it into something else and transforming things in another direction completely.

After much discussion in the working group, we’ve decided to recommend we go with the more transformative logo.

image

Let me unpack why we are recommending this. For many of us who have been around Dask for a while, the current logo will be evocative. I personally was hesitant to move away from the wings logo because it is meaningful to me. However a key goal here is to grow Dask, and new users do not have that same attachment, so we should try and put those feelings to one side.

The new logo gives us a simpler design, some more shapes to work with and more colours in our palette. Moving to an all-lowercase logo also helps with folks mistaking DASK for an acronym. It also fits more nicely with the rest of the community, many projects have all lowercase wordmarks because the project is not a company or an entity, it is a community.

Here are some notes from Jeromy/Chat, the visual designers that we’re working with on why this logo is compelling from a design perspective

When Ashandelle and the Dask Working Group looked into the Dask website and brand, we thought about how to best represent the Dask project and community. We wanted our rebrand to better embody Dask and appeal to its core audience: data professionals.

While we didn’t intend to redesign the logo, we needed a revamp to create a cohesive design language. What story did the original logo tell? What did people see when they looked at it? How did that fit into the story of what Dask is and what it does? Through those lenses, we believed a new logo could help tell a fuller story.

We didn’t enter the design process lightly. When we design (or redesign) a logo, we make it resonate with the audience, align with the project's brand attributes, fit within the product space, and look distinct from competitors.

To communicate Dask’s personality, the logo needed mass appeal, while remaining serious and credible. It needed to feel both authoritative and young, which led us to balance many design elements thoughtfully. After we and the working group collaborated, we designed a logo with repeating shapes to better represent parallel computing and community. The lowercase word mark connects the viewer to Dask’s community traits and references the history of many open source projects using all lowercase logos.

By switching to a logo like this it enables us to build a stronger design on top of it.

Stylescape

The next thing to show you is our recommendation for a stylescape. Before we started this process I had never heard of a stylescape, so I’m going to assume this term is new to others and unpack it a little. A stylescape is an example of an overall look/feel for a project’s branding. It isn’t a website, document, slide or anything so formal. Rather it’s a collection of text, images, colours, headings, diagrams, etc to show how elements look together. It is also not a final branding guide and can continue to evolve, but it helps us to converge on some shared ideas before we start investing a lot in a new website, where iteration is harder.

Dask-stylescapes-Final 76

This is the working group's recommendation for the stylescape we should progress with.

We can see font recommendations and a colour palette on the left, both created to compliment the logo. Then some examples of headings, diagrams, callouts, icons, etc.

We are trying to hit two marks with this. First is an authoritative and technical voice, a group that is listened to in the PyData and Scientific Computing ecosystem. We went with a grid that feels like graph paper, technical line drawings and stark black, grey, and white backgrounds. Elements that would suit the branding of a news outlet, textbook or election campaign.

The second is a welcoming voice where new users feel at ease and excited to explore Dask. For this, we went with primary colours and chunkier lines in some diagrams. This allows us to be a little more playful and not intimidating.

When discussing who else hits this mark we thought of a well-liked elementary school teacher. Someone you are pleased to see and can have fun with, but there is no doubt that they are the authority in the room and should be listened to in more serious moments. This is the feeling we are aiming for.

To get to this place the designers took the logo and expanded it in three different directions to see what voices we could achieve with it.

image

The first option was inspired by outlets such as the New York Times and Tesla. It leans heavily into the authoritative voice but was perhaps too stark and clinical for my taste.

To me, the second option was an easy yes, it was warm, welcoming and fun. I often try and steer the Dask community in this direction, while other maintainers strive towards that authoritative voice. But I could appreciate that perhaps it was too warm and not serious enough.

The third option had a different feel to me. That was exciting, but also made me nervous. It had a little bit of a startup vibe, which in my mind can mean flashy with no substance. But it also felt the strongest in terms of having its own identity. However, I had some concerns about how well those of us could reproduce that look/feel due to the complexity of the elements.

After a few iterations on top of those three, we worked with the designers to amplify the feelings we liked, and reduce the ones we didn’t. This has evolved into the recommendation we put forwards today.

Here are some notes from Jeromy/Chat, the visual designers that we’re working with on their thinking about this stylescape, and what it accomplishes

We extended the visual language of the logo into a cohesive style for the Dask project. The boxes now represent branching processing tasks, hold iconography, create blocks of content, and more. The updated style combines a technical, structured layout with welcoming, friendly properties.

The grid acts as a unifying tool, which breaks up negative space and can be used to anchor design components on. Where we desire authority and expertise, we often use the structured alignment of this composition. We soften the authoritative tone with rounded corners on lines, fluid placement of elements on the grid, and cheerful colors to balance the brand’s personality successfully.

What next?

As we’ve already discovered in this issue, finding consensus is impossible, especially when it comes to subjective things like design. I am hoping to see some discussion here about what we have put forward and for folks to raise any red flags that they see to ensure we are going in a good direction. However, we’re also at a point where it would be good to move on. The recommendations made above weren’t easy and took into account a variety of different perspectives.

Once we have decided on a stylescape to move forward with, the designers will begin figuring out how we want to structure our content online and mock up what our new website could look like. We need to decide what should be moved to the website (the more content we have there the more SEO type stuff we can do to improve our rankings), the blog may be a good candidate for consolidation. We also need to figure out a plan for content that can not be consolidated such as the documentation, this needs to remain a sphinx site for technical reasons and so we need it to look and feel like part of the Dask website as a whole. There are technical conversations to be had, but we are keen to save those for another issue on another day and focus on the design here.

We are confident that the recommendations put forward here will move us to a stronger place as a community.

@hayesgb
Copy link

hayesgb commented Mar 17, 2022

At the start of the conversation, I was a little unsure of the switch to lower case, but I really like this coupled with the new logo.

@mrocklin
Copy link
Member

Just so that people are aware of timing constraints, I think that the web team is planning to move forward with this. If folks have thoughts on these deisgns that they'd like considered, now is a much better time to bring up these thoughts than later down the line.

@ntabris
Copy link

ntabris commented Jun 4, 2022

The "mailing list" link in "Community" menu at top brings up the overlay card but doesn't take you to "mailing list" tab of the card if you weren't already there. The "mailing list" link in footer does work correctly.

@AdiReske
Copy link

AdiReske commented Jun 6, 2022

We just went live with the new site. Still working on the blogs section and pushing the rebranded docs.

@douglasdavis
Copy link
Member

Quick note: the animation shows "FILE.IPYMB", and doesn't appear to be a notebook :)

I'd recommend calling it something like WORKFLOW.PY

re-pinging Ian's comment ^^^

@jacobtomlinson
Copy link
Member Author

jacobtomlinson commented Jun 6, 2022

@douglasdavis the designers are working on it. Apparently the animation was created by a third-party so they are going back to them to fix it.

@jacobtomlinson
Copy link
Member Author

jacobtomlinson commented Jun 6, 2022

@douglasdavis @ian-r-rose fixed now 😄

@gjoseph92
Copy link

Meta-comment: this thread is collecting ideas for things to fix, discussion around them, and then confirmation that they've been fixed.

Most other places in the dask world, that would accomplished through GitHub issues per idea, PRs, and discussion on both. Previously, that would have occurred in the https://github.com/dask/dask.github.io repo (which I imagine should be archived now).

  1. How will the dask community have ownership of the content on dask.org now? As far as I understand, it's now effectively closed-source / off GitHub since it's built in Webflow. A few people have access to modify it. When other people see something wrong, how are they empowered to fix it (as they would be with anything else in open-source dask?)
  2. How will we track issues and fixes now? i.e., what's the equivalent of the public issue -> PR -> code review -> merge flow now? Should we have an issue-only GitHub repo for now at least, so we don't just keep adding to this thread (which would be hard for anyone to find who didn't know about it)?

@jacobtomlinson
Copy link
Member Author

@gjoseph92 the plan is to move from this issue to a mailing list where website-related things can be tracked. Previously everything was very developer-centric, part of the goal here is to become more inclusive towards non-developers. For example contributing blog posts is going to shift from needing to raise a PR to a Jekyll blog to needing to submit a Google Doc to a public mailing list.

We are definitely making trade-offs with this change. The main exchange here is increasing friction for a few (those of us who will have to maintain this new system) in order to reduce friction for many.

The goal is still to be as transparent as possible. Coordination will be done in public groups, and updating of the website and content will be managed by the web steering group, which effectively anyone can join in exchange for a long-term commitment to help manage it.

@TomAugspurger
Copy link
Member

Question about the new dask-sphinx-theme. On https://ml.dask.org/ I get a double vertical scrollbar:

image

And I'm not sure if it's related, but the footer is cutoff halfway:

image

@gjoseph92
Copy link

the plan is to move from this issue to a mailing list.

This seems a bit harder to manage to me, and easy for things to get lost. (See this thread, for reference.) What's wrong with an issue-only GitHub repo (just like dask/community)? Why create a new communication pattern here when the one we use everywhere else seems to work pretty well?

@gjoseph92
Copy link

In the meantime, I'll keep adding to this thread, since that seems to be the approach for now:

Landing page

  1. I land on the homepage and after reading every section, I still don't know what dask is. If I've never head of dask before, I'm aware that it claims to be able to "scale any Python code" and "deploy anywhere"... but what is it that I'm deploying? I would have expected a one-sentence explanation underneath "Scale the Python tools you love". Like "Dask is a flexible library for parallel computing in Python", as the sub-heading on the docs landing page explains.
  2. What’s the motivation for the code samples being animated? They’re so fast, I can barely read them, and I know dask. If I wasn’t that familiar with it, they wouldn't be meaningful to me. Plus, they’re not copy-pasteable. A static code snippet seems much more useful to me, since you can read, understand, and copy it at your own pace.
  3. Why are the installation instructions at the very bottom of the page, and not copy-pasteable, but animated?
  4. "Scale PyData libraries" links only to "learn about DataFrames", but also mentions arrays and scikit-learn. We should arguably link to all three.
  5. "Scale any Python code" links to Futures. I'd say Delayed is a better and more commonly-used and approachable interface for doing this.

Get started page

  1. The copy

    Dask is included by default in Anaconda. You can also install Dask with Pip, or you have several options for installing from source. You can also use Conda to update Dask or to do a minimal Dask install.

    is somewhat awkward and verbose for explaining a very simple thing. Installing from source is not relevant to most people; the fact that you can "use conda to update dask" makes it sound like this is some special dask feature as opposed to just what any package manger does. Why not just "you can install dask with pip or conda"?

  2. "Learn your way around" suggests links to tutorials and videos, but doesn't mention the docs.

@ayushdg
Copy link

ayushdg commented Jun 6, 2022

Question about the new dask-sphinx-theme. On https://ml.dask.org/ I get a double vertical scrollbar

And I'm not sure if it's related, but the footer is cutoff halfway

I see the same issue on the dask-sql doc page as well:
image

@jrbourbeau
Copy link
Member

Thanks @TomAugspurger @ayushdg -- I opened a separate issue for the sphinx theme over in the dask/dask-sphinx-theme repo dask/dask-sphinx-theme#74

@mrocklin
Copy link
Member

mrocklin commented Jun 7, 2022

Amidst all of the micro-recommendations (thanks for the attention all!) I also wanted to take a moment and give a big shoutout to folks for getting this done. In particular I want to call out @jsignell @jacobtomlinson and @AdiReske for pushing this process through. The new style looks great, and I'm really impressed that we pulled everything off consistently and without hiccups.

Thank you everyone who contributed here!

@jsignell
Copy link
Member

jsignell commented Jun 7, 2022

Don't forget @scharlottej13! The new docs theme is so nice!

@pentschev
Copy link
Member

Hey all, I noticed the old logo is still used in several pages of https://tutorial.dask.org/, it doesn't look like there's a pattern to which pages still are using the old logo vs those using the new one, so it may be necessary to check one-by-one.

@jrbourbeau
Copy link
Member

Thanks @pentschev -- just opened dask/dask-tutorial#239

@jakirkham
Copy link
Member

Have we shared the new logo with NumFOCUS? Looks like they are still using the old one

Also may want to sync with them about stickers (so they are using the new logo as well)

@AdiReske
Copy link

we did https://numfocus.myspreadshop.com/all but good call! i'll ask them to update this page as well @jakirkham

@jakirkham
Copy link
Member

Thanks @AdiReske! 🙏

May also be worth mentioning using this on stickers or other swag. SciPy 2022 is coming up soon and the NumFOCUS Summit in September. So it would be good to make sure anything they have there is using the new logo. Sounds like you are already engaged with NumFOCUS, but happy to help connect you if that would help 🙂

@AdiReske
Copy link

yes! here is he sticker and I'll ask Jim to bring it with them https://numfocus.myspreadshop.com/dask+logo+sticker?idea=629e25e254e3e23bfd511fea we also have https://www.pythonatscale.com/ in October with Numfocus

@avriiil
Copy link

avriiil commented Jun 23, 2022

Thanks @jakirkham and @AdiReske. At PyData London last weekend Numfocus still had the old logo up. I pointed this out to Jim and he assured me the new logo would be used going forward.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests