Dreamwidth Design Team

Design patterns

Fri, 17 Aug 2012 20:01:30 GMT

Posted by: denise

A helpful article linking to design patterns to use as inspiration.

comments

Font Awesome

Wed, 07 Mar 2012 14:06:51 GMT

Posted by: denise

Font Awesome -- free for commercial use!

comments

Article: Label placement in forms

Thu, 01 Mar 2012 06:13:16 GMT

Posted by: foxfirefey

Label Placement on Forms -- This article explains the pros and cons between different label placement strategies (top, right, left). It seems like the kind of thinking that might be useful to think about.

comments

browser/OS/resolution data

Fri, 03 Feb 2012 02:38:14 GMT

Posted by: denise

This is the information from the DW Google Analytics account over the last month. Analytics is only present on site-skinned pages, and can be blocked by the end user, so this is not necessarily a complete sampling, but it's close enough!

( browser/OS/resolution data )

comments

DW user head image

Wed, 01 Feb 2012 18:41:10 GMT

Posted by: fu

Someone over on dw_suggestions mentioned that the neutral blank userhead was just begging to have something stamped on it. That idea got stuck in my mind, and I just had to do something about it.

Presented for your voting pleasure, two subtly DW-ized versions of the userhead, which politely states which site you're on, but (hopefully) without sacrificing the original's neutrality:

View Poll: DW user heads

comments

small project for a designer to start with!

Tue, 31 Jan 2012 07:36:54 GMT

Posted by: denise

I've been horribly remiss about posting design opportunities, but this started to annoy me tonight while I was working on something else, so I opened a bug for it:

Bug 4304: email posting setting should get some updates

This is the "Email Posting" setting on the Mobile tab of Account Settings, and it's horribly dated-looking. If anybody wants to try your hand at a new version, have at it! Even just a rough mockup would be awesome. Some suggestions are in the bug, but generally I'd like to streamline the layout, eliminate all the duplicated text, and fix the horrible alignment glitches produced by the checkboxes, as well as using some AJAXy goodness to only show one additional (non-used) entry box at a time.

( Screenshot of existing design )

comments

What are the best ways to roll out styled icon/profile pages?

Mon, 14 Feb 2011 21:38:26 GMT

Posted by: foxfirefey

So, one of the projects Styles has been working on is custom icon and profile pages. The stunning exor674 has implemented a backend for custom icon pages; after we implement them for all styles, we will be working on custom profile pages.

One of the concerns is that a good amount of people are going to not see icon pages--and especially profile pages, which are difficult enough to do effectively without shoehorning them into a style--in styles. But we don't want to multiply too many options. Possible strategies are:

Add a separate display option for icon and profile pages, or just profile pages since icon pages are far less likely to be troublesome in styles.

Don't add any options. All styles will have the ability to display icon and profile pages in the site style, just like entry pages. Somebody who doesn't want to view them can use the style=mine sticky display and set them thus. This will not satisfy the people who don't want to set display options for style=mine, but it's probably the fewest options.

Hooking them up to the entry display option--probably not a good idea.
Hooking them up to the journal display option--also not a good idea, since few people will be using the site view for their journal.

Other ideas welcome!

comments

Browser/OS/Resolution/Frequently Visited Pages Data

Wed, 26 Jan 2011 13:27:58 GMT

Posted by: denise

This is the aggregate data from DW's Google Analytics account from the last month running.

( Browser/OS/Resolution/Frequently Visited Pages Data )

comments

List of Classes

Wed, 22 Dec 2010 16:41:19 GMT

Posted by: fu

I've been working on cleaning up the design of Dreamwidth. Long term, the goal is to make the design coherent. On this first pass, I only aim to consolidate (most of) the existing classes and elements, collapsing to one class and styling instead of a couple dozen similar-but-different ones on each page, where appropriate.

Side effect, each of the site skin stylesheets is now lighter by something like 10kb *g*

I've thrown up a static page with a list of classes and styling for each class.

The design is not final. But assuming there are no huge glaring issues, I'd like to go ahead and commit this version or this version with some tweaks. (There shouldn't be a huge difference from the current appearance yet).

This doesn't mean that we shouldn't talk about what the design should look like! Just that I think the current code is a good balance of cleanup and not breaking existing appearance, and that I'd like to be able to commit at this stage rather than holding it up forever while we work on a polished design (so let's discuss right here, right now, but I want the overarching design changes to go in the next patch please, and not hold up the commit on this patch)

We need to work on cleaning up the HTML so that the styling / new classes look good when applied to the HTML. As we clean up our HTML, some of the existing classes will go away; that's good, we want that. There's quite a few ridiculous CSS classes in there that are meant to be temporary (say, for example, action-bar and action-box ;-))

For coders/frontend designers:

Use the current global classes listed on /dev/classes as much as possible, instead of defining new ones.

If you're adding a new class to any page, add a sample usage demo on /dev/classes (unless it makes no sense to, but you should try to have it make sense to)

For the dev-oriented among you, I have uploaded patches to Bug 3243 - Need consistent styling across the site

If you apply the patch, and restart your servers, you will find the live page for my static HTML mockups in /dev/classes.

comments

HTML mockup for manage/circle/edit page

Tue, 21 Dec 2010 04:37:43 GMT

Posted by: fu

I've been working with hope on redoing a couple of pages, and here's one of the pages that resulted from the brainstorming.

HTML mockup of a revised Manage Circle page

Throwing it out here for discussion and fleshing out. This is just quick example HTML. The CSS is preliminary (more on that in a bit), and there's no supporting JS so if you could kindly gloss over these two things :-)

The biggest changes are:

tabs for the various sections (to be hidden by JS), so that you can focus on only one thing at a time, instead of scrolling up and down the page

changing the way the relationships split up so that it's split along the lines of your relationship to them / their relationship to you, rather than access/subscribe

a dropdown so you can sort by username or relationship

a filter for usernames so you can easily find / edit people in your circle

cleaner table markup, and cleaner markup in general

added heading for the custom colors

comments

Design pages on the wiki

Sat, 20 Nov 2010 07:00:05 GMT

Posted by: foxfirefey

I was doing some wiki tending tonight and found design pages! We might want to take a look over them, figure out what still applies, and then link them as some of this community's link list references.

comments

Browser/OS/Resolution/Frequently Visited Pages Data

Tue, 26 Oct 2010 06:01:11 GMT

Posted by: denise

This is the aggregate data from DW's Google Analytics account from the last month running.

( Data! )

comments

questions from an LJ convert

Mon, 18 Oct 2010 23:46:51 GMT

Posted by: r_bomber

Heya

So I recently joined Dreamwidth from LJ, and I'm absolutely loving it. I'm just wondering though if there is a way that I can get the posts from my LJ friends on my DW Reading page so I don't have to flick between two different sites.

Is there a simple way, or should I do them as a feed?

I had a look through FAQ, but couldn't see anything specific to this situation, but there is a good chance I totally missed it.

Also, sorry if this is the wrong place to post this... if it is, let me know and I will re-post int he correct place!

THANKS!

comments

Browser/OS/Resolution Data

Thu, 02 Sep 2010 22:07:49 GMT

Posted by: denise

This is the aggregate browser/os/resolution data from DW's Google Analytics account from the last month running. I will try to post these every month for the previous month, so if I don't, poke me!

( Data )

comments

Stuff that needs fixing

Sat, 31 Jul 2010 06:44:51 GMT

Posted by: denise

I'd like to make a list of things that need some design work: things that could be improved, workflow-wise or visually, for better usability or accessibility.

Things I can think of, off the top of my head:

* The reading/subscription filters management interface
* The access/posting filters management interface
* The Manage Circle page
* The Upload Icons page
* The Directory Search

What else can people think of that needs work?

comments

Welcome!

Wed, 02 Jun 2010 10:49:09 GMT

Posted by: denise

This is the community for people who are interested in working on improving Dreamwidth's design! While visual design, aka "how pretty it is", will be part of the job, we're also going to be working heavily on user experience and usability design, to improve the methods by which people interact with the site.

This isn't going to be done overnight; Dreamwidth (and LiveJournal before it) grew organically over time, with a number of different designers (and often no designers at all) and many of the taskflows disagree violently with each other, or are needlessly complex, or just could use a little love. But this is where we get a start.

There'll be two major (ongoing) projects for the design team:

1) Working to improve the usability and workflow of existing features, slowly over time;
2) Acting as resources for programmers working on implementing new features, to help them with the workflow and presentation of those features.

Stay tuned for more resources and plans!

comments

Dreamwidth Design Team

Design patterns

Font Awesome

Article: Label placement in forms

browser/OS/resolution data

DW user head image

small project for a designer to start with!

What are the best ways to roll out styled icon/profile pages?

Browser/OS/Resolution/Frequently Visited Pages Data

List of Classes

HTML mockup for manage/circle/edit page

Design pages on the wiki

Browser/OS/Resolution/Frequently Visited Pages Data

Recommended design reading

questions from an LJ convert

Browser/OS/Resolution Data

Stuff that needs fixing

Welcome!