Loomio

Develop Diaspora* Design and Identity

PC Pablo Cúbico Public Seen by 183

> Was: Diaspora UI enhancements with minimum coding effort

Hi people!

I'm new here, I was starting an experiment with Diaspora UI, just by doing minor enhancements with little or no coding, just CSS/HTML, not breaking any JS logic or backend work.

I started a mockup and it turned out pretty nice, so I thought: what if I turn that into a proposal?

I hope you like it! But if you hate it, don't hesitate to say so... I may do it on a fork for fun anyway! :P

Strategy, time, resources, etc.

Details on the proposal are here:

http://piratepad.net/diaspora-ui-proposal

Feel free to edit, add, etc.

Mockup

Mockup is here, click "Comments" on the bottom, or press "C", you will see some pink comment bubbles. Feel free to comment there also:

http://invis.io/X3RBEAQA

Thanks for your time!

You can find me at [email protected]

PC

Pablo Cúbico Wed 23 Apr 2014 1:24PM

@rasmusfuhse great! Designs are of course far from being final. I was experiment with some textures, styles are yet to be defined.

G

goob Wed 23 Apr 2014 1:54PM

One small point: Diaspora currently uses Entypo for icons, and a decision was taken not to move to FontAwesome.

The first stage would seem to be conceptual: what Diaspora is for, and what sort of experience we want people to (be able to) have. From this design ideas will come.

Although it would be good to have a common strand running between the various elements of the project (Diaspora itself, the project site and the wiki) I don’t think the design needs to be completely unified throughout. As long as there is a common ‘feel’, that is enough.

We can use the minimal amount of branding necessary for users to know that they are using parts of one project. We’re not a commercial operation needing to ram home the branding at every opportunity.

If we’re going to change the design of the UI in Diaspora itself (and no reason we shouldn’t), we should allow users to keep the current ‘classic’ design if they want to. I don’t think we should force a change on people unless they want it.

I absolutely agree with your points about (a) accessibility and (b) responsiveness. Ideally, Diaspora should be equally easy to use for people with all levels of (dis)ability and on all devices.

If the Diaspora UI can be made completely responsive, it might be that the mobile version will no longer be needed. But that decision should be made as part of a separate discussion.

It looks as though you’ve made some decisions already (e.g. ‘Foundation will have a warm color palette suitable for discovery’), and it would be good to have some discussion about these things, but your input about them will be valuable.

It would be good to work out a minimum set of criteria for compliance with Diaspora’s design and branding, so that pods which want to customise their look can do so while still recognisably remaining part of the Diaspora ecosystem. I think this is what you address at the end of your proposal. Customisation of the UI of individual pods should, I think, be welcomed and encouraged.

Thanks again for all your valuable work on this.

PC

Pablo Cúbico Wed 23 Apr 2014 2:02PM

Hi @goob thanks for taking time on your input!

Please mind anything I say as merely suggestions and not decisions! However, I have strong belief in those.

Didn't know about the FontAwesome thing, I think Entypo is pretty much the same... as long as they are vectorial and free, have no special preference. Of course Diaspora* could have its own set, but that will be another phase, since it's much more work.

Thanks again!

G

goob Wed 23 Apr 2014 3:05PM

Oh, two things which I have been wanting to redesign for a while, but haven't had the energy/expertise:

If you'd like to help me also with those, I'd appreciate it.

PC

Pablo Cúbico Wed 23 Apr 2014 3:26PM

@goob of course! Also, we should definitely need to build a proper list of things that are in need of some design.

IGM

Ivan Gabriel Morén Thu 24 Apr 2014 7:28PM

@Pablo: Would it be possible to see a mockup of your ideas for the default, light daspora design? The one that is linked from your proposal is a bit vague as it builds on a background image and a dark header with completely new icons, and personally I find it hard to see where you're heading exactly :)

I have by the way been working on some icons in a slow pace, tinkering possibilities to symbolize pods, users, notifications and so on. I'm pretty sure we could come up with our own personal and communicative iconset in the future, and maybe make use of svg as delivery format instead of converting all icons to an iconmap. Vector graphics are getting better support in browsers all the time, and would work out better on a responsive site as the dimensions don't affect file size. This is an off-topic discussion though, sorry for that ;)

PC

Pablo Cúbico Thu 24 Apr 2014 7:55PM

Hi! The UI design for that part is just an attempt for making D* look better without even changing the layout that much, using the current one with just some CSS tweaks.

So, not much innovation there, think of it as a first iteration of a progressive enhancement approach; much more could be done by actually freeing the layout, but I wanted to be as realistic as possible with the current resources.

Background image is just a sample of how some basic customization that could enrich D* experience with little effort.

Having an icon set would be great!, we can really nail it doing some basic user testing to check if the metaphors match the actions.

PC

Pablo Cúbico Thu 24 Apr 2014 7:56PM

(I meant: "some basic customization LIKE that")

PG

Paul Greindl Mon 28 Apr 2014 5:38PM

Just to see that I understood correctly. Is the plan here to change the design to reflect what is proposed in the mock-ups?

PC

Pablo Cúbico Mon 28 Apr 2014 7:09PM

Not exactly, the mockups are just an attempt to show the potential impact that a redesign could have. The plan is to open the process (it's explained on the proposal).

However, I have to mention that I put some serious thought into it, and that design reflects my ideas on what it should be like. If you go outside and look for another designer, he/she will come up with something totally different (probably). And of course it has my style on it, as it will with any other designer.

As for the diaspora* design, I explained in a previous comment:

The UI design for that part is just an attempt for making D* look better without even changing the layout that much, using the current one with just some CSS tweaks.

So, not much innovation there, think of it as a first iteration of a progressive enhancement approach; much more could be done by actually freeing the layout, but I wanted to be as realistic as possible with the current resources.

Load More