{WIP} Re-Design of Jupyter.org Website

Great idea! I dumped the scenarios above into this doc. Anyone can edit it so feel free to add to it or make changes!

@betatim That’s really interesting. I’ll bring this up with the team. For this test specifically though, some of the pages we want them to find are already non-existent, so it might be a bit too confusing to not use names in the tasks. However, we might be able to use this method when we do usability tests on our redesign later on in June/July. At that point, hopefully, the information architecture will be more aligned with how users naturally explore the site so then the tasks could be more creative.

@lresende You’re right, Project Jupyter has so many components, we couldn’t dive deep into all the different parts of the site even in the 1-on-1 interviews. It’s incredible.
I will say though, that we are looking at influential sites to see what works well for them just like you suggested, but unfortunately, our timeline for this project is rather short for a thorough research-driven website design. Given the mandate that we received from the steering council: The site should guide and inform individuals, organizations, contributors, and sponsors about Project Jupyter’s core values, technology, and community; we only have a limited amount of time to try to provide a website and components to meet this goal. These use-case tasks will give us an idea of how users begin to explore the site, and I’d imagine that when we hand over our redesign & research data to the community, that this project will continue on and improve, especially with broader strategies like you suggested.

1 Like

Good point and +:100:! I’d use phrases/wording which doesn’t use Jupyter Jargon (JJ) in the description of the link to the sub-pages/third party sites.

One page I find cute (but never actually use) is https://whatcanidoformozilla.org which isn’t about informing people directly but it is a neat design pattern for directing people through a (huge) decision tree.

We’ve been working really hard on the Jupyter website redesign, and as result we’ve fallen behind on updating you all about our progress. Our apologies. We want to spend this week catching you up on everything that we’ve done so far.

First up is our affinity diagrams. We created two: one based on the functional needs of Jupyter, and one based on the emotional and social needs. All of these insights were gathered from our in-depth interviews with Jupyter users, non-users, contributors, and community members. The diagrams helped us create “jobs-to-be-done” for the website and the archetypes that we’ll be designing for. We’re going to share both of those later this week.

Please let us know if you have any feedback!


2 Likes

We aggregated our interview data (using affinity diagrams) and formulated jobs to be done, the emotional, social, and practical needs the new Jupyter.org website needs to fulfill.

We’ll update you with our archetypes, cognitive walkthroughs, and sitemap later this week.

4 Likes

Hey everyone!

Here are the main archetypes considered in our redesign effort. These archetypes are modeled from a behavioral perspective for potential website visitors. This is a great method for validating user flows and site navigation. It focuses on understanding who does what, when, and why.

Also, here is a summary of our Cognitive Walkthrough. For context, CWs are basic interaction design exercises used to step into the shoes of a potential user and see how they might navigate the site based on their persona and hypothetical needs. In this case, we used the archetypes in the previous post to approach Jupyter.org as first-time visitors. We tried our best to step into the shoes of these archetypes and used this exercise to help our understanding of the site’s information architecture and possible user flows.

(Note: the archetype for “new user” is labeled as “visitor outside of data science” in this image)

Hi friends! My name’s Graham, and I was added to the MHCID team in the beginning of May!

I’m excited to show our first concept for a sitemap of the website redesign:

Here’s a brief explanation of each section with a little more detail than the graphic:

Home
This page will be the landing page for jupyter.org, and act as an introduction to the mission and branding of Jupyter.

About

History

  • This section will detail the history of the organization and project, including the mission of open-source computing and the goals of the organization.

Hall of Fame

  • We envisioned this page as a way to showcase members of the community and entities that have done exceptional work towards Jupyter’s goals

Governance

  • This page will explain the governance of Jupyter as aqn organization, and link to members’ GitHub handles, similar to the “Steering Council” section on the current website

Partnerships

  • This page will house all information relating to partnerships with Jupyter, such as sponsorship and institutional partnership

Projects

Core

  • We’re really excited about this section, as we’re designing an ecosystem in which each project has control over it’s content and outreach. This will be a catalog of all core projects, including an overview of each project (and a list of their products), their team and contributors, and all the documentation for that project!

Orbit

  • We also wanted to showcase all the projects out there that use Jupyter as a baseline! This page will be a catalog of those projects, linking to each of their unique pages

Documentation

  • This page will hold links to all of Jupyter’s documentation, including contributor and developer guides. The current website has these split, and we hope to streamline that flow for all users!

Community

Overview

  • Jupyter is such a unique ecosystem of diverse communities built around the organization. We wanted a place to showcase that, and to allow new users to find communities they want to contribute to. This section will act as a catalyst for building each community out there!

Events

  • This section will contain a calendar of events, and information on how people may volunteer with Jupyter and/or its various communities.

Blog

  • Jupyter’s fantastic blog will be showcased here!

We’re so excited to continue to iterate through our design process, and create a website that serves each and every one of you. Let us know what you think - we’ll be coming back soon with much more!

3 Likes

Hey everyone,

We’re playing around with some new taglines and descriptions and wanted to get your thoughts on our current drafts:

Tagline:
Compute together

Description:
Project Jupyter is a free suite of tools for computing openly, transparently, and collaboratively, built by and for a worldwide community.

Let us know what you think, thank you!

We wanted to share with everyone the first drafts of some new webpage copy that we’ve put together:

Homepage: https://docs.google.com/document/d/1NW1YUWCy_VL7bTv8R1U4FsDFPTNvjY77waaLVqiOywU/edit?usp=sharing

History page:

Please share your feedback by leaving comments or suggestions directly in the Google Docs.
Let us know if you have any questions. Thanks!

Additionally, we’re also beginning to do a product audit to get a better understanding of how to prioritize and categorize them. So if you guys can help us start by listing the products and grouping them in ways that make sense to you, that would be super helpful!

Hi everyone,
We’re excited to show you our first round of low-fidelity prototypes for the new website. Please take a look and let us know what’s working well, what’s not quite working, and if we’re missing anything. We’re moving quickly with the design phase, so please share your feedback ASAP.
Looking forward to hearing your thoughts!









I think it looks slick! I like the minimalism of colors, which lets the Jupyter orange pop a bit more. A couple quick thoughts

  • I think the Jupyter logo replacing the Os is a cool idea, but I wonder if it’d look cleaner if we didn’t include the planets (aka if we used the favicon that Jupyter notebooks and lab use)
  • can we avoid calling Jupyter lab “the next generation interface” and instead call it “a next generation interface”? I think it’s more inclusive of the other tools out there as well as other cool open source interfaces like nteract
  • my personal preference is to avoid calling them “products”. I dunno why I feel that way but it seems like it comes across too much as a “producer consumer” split, whereas in Jupyter we want our consumers to also be producers (or at least to see a pathway there)
  • I think we could have a few more “core” projects in there, such as the Jupyter notebook (eg the kernel/server/ipynb stack you mention elsewhere in the docs) or the binder project

I’ll try adding more thoughts as they come to me! But in general I think it’s a really nice start

2 Likes

It looks nice!

Some thoughts:

  • how does replacing a letter play with accessibility, screen readers, visually impaired people who don’t use assistive tech. On the zoomed out images I had to look twice to realise you hadn’t made a typo but that the logo was meant to be the o (even though it looks like it has open sides). Maybe use a character at first and if the page has been loaded for a long time have a animation that swaps it for the logo or some such?
  • I don’t like calling the projects “Products”. It instantly reminds me of a company website (I am now looking for a Pricing page to figure out if I can afford the products) or even worse of a website that wants me to think something is a commercial product but actually it is two people in a shed (I end up feeling mislead)
  • I wouldn’t use “transformative impact” on the first page. It is a buzzword that probably most people don’t really know what it means and those who do instantly go into cynical mode. I’d test it on a few people to see if it triggers a happy association with people (who aren’t grant managers). Maybe “Success stories” or “use cases” or “Jupyter for…”. The suggestions are not great, I’d have to think a bit more about what it is that is in this section.
  • Instead of “Empowering users to create and share…” how about something like “Helping people to create and share…”. Trying to find a non bullshit bingo word to replace “empowering” and moving from “users” (can I send money to Jupyter?) to people (though maybe robots are also using Jupyter?)
1 Like

You jest, perhaps, but this is kind of a big deal! A top-level OSS marketing site should absolutely say how you can send money! I’m imagining a top-level “Give Back” menu item, maybe buried under one level.

This would also be an appropriate place for Jupyter Swag (though last i checked there were Some Problems on listing our own stuff).

There was also the “Jupyter Whitepaper” initiative, not sure where that went, but it would go here as well.

Aside from whatever copy is needed, the outlink options are pretty broad these days, but we probably need to establish a presence on them:

  • tidelift: https://tidelift.com/lifter/search?q=jupyter
    • by the by, i want a map like this of Jupyter so bad i can taste it: https://cdn2.hubspot.net/hubfs/4008838/Vue-dependencies.svg
  • numfocus: https://numfocus.org/wp-content/uploads/2019/05/2019-Small-Development-Grants-Prospectus.pdf (who are those good looking people?)
  • github sponsors https://github.com/sponsors

Thank you everyone for your feedback! This is extremely helpful. Does anyone have any good suggestions for potential alternatives to ‘Products’? What about ‘Tools’ or ‘Software’?

Thanks for listening!

I think my favourite is “Projects”.

2 Likes

+1 to projects, I think it also reflects the fact that many core efforts of Jupyter aren’t strictly technical outputs

I think there are two (potentially competing) things at play here:

  1. How do we reflect the state of things and our open-source values?
  2. How do we communicate what’s on the website to those who aren’t already interested in, and aware of those things?

I think much of the website will be a place to draw in people who are currently outside the ‘Jupyter bubble.’ I’m working under the assumption that returning visitors or people who are already in the Jupyter will use the website for three main things: to access documentation, as a portal to communication channels, and to check up on events/news. I don’t see people using Jupyter on the regular or contributing using this website as a resource to explore Jupyter Product offerings (at least not very often).

On the other hand, I think new users may be confused by ‘projects’ I imagine myself looking at the website if I’m not familiar (I know! I’m not the user… but I try to understand them). If in that situation I see the word ‘projects’ I assume that’s a list of projects that Jupyter has worked on or projects that have been successful with Juptyer software.

I’m open to the thoughts of others, but I personally think the driving design questions here are:

  • What exactly are we presenting in this section?
  • What word most clearly communicate that to people unfamiliar with Jupyter or open source?
2 Likes

Just re-read that and I think I left it too open ended.

I think what we’re presenting in this section is mostly a combination of software products and software solutions. I dislike both those words because they are both such buzzwords and they make it sound like we’re trying to sell you something. I mentioned above why I have hesitations about the use of ‘projects’ I think we should gather some data on how people who have no exposure Jupyter perceive both ‘products’ and ‘projects’. We might also want to gather some data on ‘software’ or ‘tools’ as well. Wouldn’t hurt.

Thanks team, keep up the good work.

2 Likes

What about “Open Source Tools”?