Conceptual Design - Solid better User Experience

#1

Hi,

I am working on a React App with improved user experience and also introduce new (or improved) some concepts.

Simple prototype here: https://sketch.cloud/s/xV7zv/v89x7Qd/play

For Solid to have a solution that “anyone” including my father :slight_smile: can use, the experience must really be much less technical than it is today. I know there is some very skilled people working on a UI right now, so this is not a UI proposal, just some thoughts from what I have seen today and what could be done to make it easier to adapt for the masses.

The main concept is a Dashboard that is interactive and also shows you relations between things, for example who/what you shared your data with. Be able to call instantly from contacts, add appointment directly to calendar and so on.

Please feel free to chat with me on Gitter and/or add comments to this interactive Prototype, that includes a login and a Dashboard that visualise some of my ideas.

We will continue hacking on the React App improved experience, mainly logic stuff, rewrite some solid libs to ES6 etc…, but we will not put any UI focus until the Solid UI will arrive. We could always use a hand, we have big day time projects to deliver as well, senior level ES6+ and React is required.

/Eduardo
https://www.linkedin.com/in/eduardo-ibacache-rodriguez-707117172/

51
Screen Shot 2018-11-06 at 22.19.51.jpg2378x1904 706 KB

#2

Cool design!

Dashboards are a really cool concept, and something we usually see more as an app-specific dashboard(one that just one website on its own would implement).

General user dashboards haven’t yet reached a climax in terms of innovation, I personally think, so it’s cool that you’re working on this.

In terms of the design: I really like how you have the colored blocks on each div section(ex. the blue indicator next to My Profile). I also really like how you set this grid up and are demonstrating all of the different features of Solid, mainly who you choose to share your data with.

The two things I’d watch out for is spacing, especially on the navbar, and content nesting(how much content you put in each panel), especially for calendar and health. What I’m getting from the design is that you want the user to get a general feel for the content and then have an expanded view when they click at it, so it might be more important for your own purposes to capitalize on how captivating you can make the panel’s design can be.

Overall, cool stuff!!

#3

I think someone (read: Not me, as I’m not a developer) should throw some work on this because frankly, this is such a vast improvement over this here, I cannot even put it into words :slight_smile:

image
image.jpg781x811 80.2 KB

It would work wonders on making non-technical people more enthusiastic about Solid.

#4

Yeah, that’s very true.

#5

@eduardoinnorway, this would be an excellent addition. “Relationship is the currency of every living system” ~ Louise Diamond

Promote this forum to newcomers more intensively
#6

Hi all,

In order to do not paraphrase myself, please check my introduction.

I hope that in the next months project POC could progress and we could show you some mock-ups at least.

BTW: Love :heart: the concept mock-up by @eduardoinnorway

#7

I like your design.

The current pod design reminds me of Geocities. I wondered if that was intentional.

“Re-Geocities the web”

#8

Saw this from Inrupt in early 2018

Things%20Thomas_v2%20Inrupt
Things Thomas_v2 Inrupt.png1500x586 324 KB

#9

As @eduardoinnorway has informed me, he doesn’t work on his prototype.
so I just start a dashbord based on Bootstrap if someone is interested
https://scenaristeur.github.io/solidash

for the moment, we can just login / logout so everything is todo.

Index.html in a Pod folder and keeping browser
#10

Here is a page for you https://mikeadams1.github.io/solidash/portal.html

#11

@adventure, nice it could help for a quick start but I encountered a bug : I was logged as holacratie.solid.community and want to explore smag0.solid.community/public . When I want to see subfolders, as smag0.solid.community/public/blog but altought this folder is public, I’ve no right.

It looks that the part ‘public’ in the URL as disappear and it looks at smag0.solid.community/blog
. See this pics
But it looks ok if I put the trailing / as https://smag0.solid.community/public/

Screenshot_20191107-074921_Chrome
Screenshot_20191107-074921_Chrome.jpg720x1280 176 KB
Screenshot_20191107-074913_Chrome
Screenshot_20191107-074913_Chrome.jpg720x1280 215 KB

#12

Oh, that would be a nice way to try out the idea.

I’ve not been thinking about design though - still fermenting. I’ve not given up but also not sure if my idea is worth continuing with, as it would be a lot of work. So I was not planning to think more about this part, and was going back to play with a different area of the concept that lead me to think about that. The original seed was more spoggy like stuff (visualisation and interactive UI), so I’m going to look at and play with visualisation stuff I think.

Happy to engage of you want to have a go though.

#13

There must be a way to rip off Sparql Web Pages. I say ‘rip off’, but I mean that in a nice, kind gentle way. Legally :smile:

#14

I understand, it is sensitive, you have put the / at the end, like: https://smago.solid.community/ I do have a version that does not require / if you think that would be bettor. It’s in the mashlib, I could probably edit that feature out for the instance of this use?

#15

How about Sparql-Fiddle? https://mikeadams1.github.io/solidash/sparql.html
How about jquery? https://mikeadams1.github.io/solidash/jquery.html

#16

“How about Sparql-Fiddle? https://mikeadams1.github.io/solidash/sparql.html
How about jquery? https://mikeadams1.github.io/solidash/jquery.html”

I think two threads got mixed together. I was responding about Building an app out of RDF.

#17

Well how about that, it’s like Ragu, its in there now.

#18

I just switched my picture back to starbucks if thats what you mean :grinning:. I was temporarily masquerading as saint thomas aquinas to appear philisophical, although I don’t know much about philosophy!

#19

Just want to note that the bug that was reported here earlier now has an issue in the folder-pane repo.

#20

Thanks @megoth I am also checking this out as well.