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

Design: Connections / Peers List #38

Closed
olizilla opened this issue Mar 16, 2018 · 12 comments
Closed

Design: Connections / Peers List #38

olizilla opened this issue Mar 16, 2018 · 12 comments
Labels
kind/enhancement A net-new feature or improvement to an existing feature topic/design-visual Visual design ONLY, not part of a larger UX effort

Comments

@olizilla
Copy link
Member

How should we indicate to the user that they have peers. That they are participating in the distributed web with many other people.

How much info should we show about who and where you are connecting to? What can I do with it?
What functionality could we add to turn this into a great feature, or is it purely informative? Can I block or mark peers as friends (see: #36) for example? Chat? Browser files other peers?

What shouldn't we show? Is it creepy to show peoples geocoded locations from their public ip? This is related to the more general question of what ipfs node stats we should show and how #33

The current state of things is described here: https://github.com/ipfs-shipyard/pm-ipfs-gui/blob/master/research/README.md#connections--peers

@akrych
Copy link

akrych commented Mar 17, 2018

Also here: ipfs/ipfs-webui#229 in my opnion very nice graphic visualisation of peers

peers

... Can I block or mark peers as friends for example? Chat? Browser files other peers?

Is that possible? It will be nice features!

@olizilla
Copy link
Member Author

olizilla commented Mar 19, 2018

@akrych i agree, that visual looks great. The 3d globe on the existing one is fun, but it seems to consume a lot of system resources / makes my browser slow. I haven't profiled it, so I don't want to assume it's the globe... but we need to add in performance to our criteria. This one could show all the pins at once, which is a trade off... completeness (wow! everything!) vs relevance (oh! there are 10 IPFS users in my city!). I do like this one tho.

@olizilla
Copy link
Member Author

Doe anyone else think that showing the location of Peers sends a weird "we know where you live" message to users? User who may be currently concerned at the unobservable amount of surveillance the centralised alternatives may be engaging in.

It could be argued that we should show it if it's possible to know it, as implies to a user that IPFS is not a completely anonymous space by default. If that's the case, then we should be much clearer about it and explain or link to a good explanation of the privacy expectations they should have.

@hacdias
Copy link
Member

hacdias commented Mar 20, 2018

It might be scary on IPFS-Desktop. Although I think we could show at least the country in the WebUI. What about showing only the number of peers in IPFS Desktop and that would link to a page in WebUI with the list of peers?

@alanshaw
Copy link
Member

I really like that visual. I don't think it's creepy that you can see the location of other IPFS nodes. They are effectively anonymous anyway. Disallowing zooming on the map will probably help even if it is creepy, because you won't be able to pinpoint a node (not that it is accurate anyway).

I feel this page needs a purpose, beyond reinforcing the fact that you are connected to peers around the globe, and beyond just something that looks pretty.

The peer list feels really redundant. I can't imagine a reason why I might want to scroll through it...

What if it was instead a list of peers currently download from you and a list of peers you're downloading from? Then we could show bandwidth and speed stats and maybe expand to see CIDs being transferred.

  • Network address column redundant right?
  • Location column could just be country flag?
  • Agent, redundant...

I like the idea of the avatar in the list but until we have the concept of buddies (and a buddy avatar) it's always going to be a generated icon.


Hey, we should totally build IPFS gravatar so you can associate a Peer ID with an image.

@lidel
Copy link
Member

lidel commented Mar 28, 2018

I feel this page needs a purpose, beyond reinforcing the fact that you are connected to peers around the globe, and beyond just something that looks pretty.

How about adding some data visualization widgets that displays peer list in different forms?

  • subset of peers currently transfering data, ordered from the most expensive one
    (i think it is doable, commandline API has ipfs stats bw -p <PeerID>)
  • pie chart showing distribution of peer nodes across continents and/or countries
  • graph showing peer count over time (eg. last 24h) or since the page was opened (if we dont gather historical metrics yet)

Here's an Idea:

Stats and Diagnostics Page

(I am not sure if this is the right place, let me know if I should move below to a different/new issue)

Perhaps "Peers" page should be renamed to "Stats" (or "Metric") page where "Connections / Peers List" becomes only one of tracked data sources?
We could put realtime widgets for metrics exposed via ipfs stats bitswap|bw|repo (and many more that will be added in future) below the peer map.
It would make the page both interesting and extremely useful.

Some inspiration (data visualization aspect) below.
Note these are generic tools, our would look better as we aim to have a distinct IPFS brand :)

Grafana

Live Demo: http://play.grafana.org/

screen shot 2018-03-28 at 15 36 29

Kibana

I like the collapsible left menu, it makes space for visualizations:

kibana-timeseries

Netdata

Live Demo: https://london.my-netdata.io/default.html#theme=white;help=true

screenshot_9

Tabler

68747470733a2f2f7461626c65722e6769746875622e696f2f6173736574732f696d616765732f64617368626f6172642e706e67

@olizilla
Copy link
Member Author

This is a rad idea ipfs/ipfs-webui#223
highlight peers closer to you on the network.

@olizilla
Copy link
Member Author

Chatting to @lanzafame about the peers page, we realised that the map was kind of a proxy signal for subjective network health... are there plenty of nodes near me that I can share with or are all the things gonna be intercontinentally slow?

@lanzafame
Copy link

@lidel some more dashboard inspiration: https://www.behance.net/gallery/55843413/Console-UI, you have to scroll down to get to the dashboard section.

Also, hive plots are a visually meaningful and comparable network diagram, that would be awesome to look at. 🙃

@lidel
Copy link
Member

lidel commented Jun 29, 2018

Thanks for sharing!
I really like these Connection Stats screens from Console-UI:

113f6d55843413 5997d56cd08c6
edee0155843413 599a426de1319

Hive plots do have some interesting properties that make them shine as robust diagnostic tool:

Hive plots make it possible to assess network structure because they are founded on network properties, not on aesthetic layout. Visualizations of two networks are directly comparable. Importantly, hive plots are perceptually uniform — differences in hive plots are proportional to differences in underlying networks. This makes it possible to use hive plots to assess network similarity.

Something to note is that hive plots look really alien while WebUI aims to be intuitive and friendly to less technical users. Not saying it can't be done, just that we need to be extra careful :)
cc @olizilla, as he may be interested (in the context of Filecoin)

@lidel
Copy link
Member

lidel commented Feb 7, 2019

Screenshots at biglybt.com show various visualizations of activity between peers, block exchange process and other stats.

Those screens are extremely utilitarian, made in old school aesthetic, but I feel make an important prior art, as BiglyBT is the continuation of the Vuze/Azureus open source project first created in 2003. That is a long time to iterate over ways p2p exchanges can be visualized.

"Piece Map"

biglybtdesktop

@ericronne ericronne added design topic/design-visual Visual design ONLY, not part of a larger UX effort and removed design labels May 22, 2019
@jessicaschilling jessicaschilling added kind/enhancement A net-new feature or improvement to an existing feature and removed kind/improvement labels Apr 1, 2020
@jessicaschilling
Copy link
Contributor

This is primarily being used as background info for the work in ipfs/ipfs-webui#1003, so closing this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind/enhancement A net-new feature or improvement to an existing feature topic/design-visual Visual design ONLY, not part of a larger UX effort
Projects
None yet
Development

No branches or pull requests

8 participants