Twitter vs. TED.com redesign http://www.webdesignerdepot.com/2014/02/the-secret-of-successful-redesigns-what-ted-got-right-and-what-twitter-got-wrong/
TL;DR:
"99% of good design is redesign Design is about solving problems, but it’s rare that your first solution is your best. Quality is achieved through iterations: designs are redesigned and redesigned; concepts receive incremental improvements; solutions evolve."
"Ted.com redesigned by focussing on their core problem—the need to display videos on the devices their audience favors—and then assessing where their existing solution fell short. Twitter.com redesigned by focussing on their existing site, and applying a new skin."
"The single largest error you can make when redesigning is to mistake the current solution for a problem to be solved."
Overhauling a UI Without Upsetting Current Users http://uxmag.com/articles/overhauling-a-ui-without-upsetting-current-users
"In order to make functional (not just aesthetic) improvements, product managers and design teams need to perform research with real-world users."
"One of the most common mistakes companies make is to implement UI changes based on what users say they want."
Strongly agree with these above and thankful for Abbey's existence. We should look into users' difficulties more than we read what they say.
On Mon, Aug 25, 2014 at 9:35 PM, Sarah slimvirgin@gmail.com wrote:
On Mon, Aug 25, 2014 at 8:02 PM, Erik Moeller erik@wikimedia.org wrote:
On Mon, Aug 25, 2014 at 7:33 PM, Sarah slimvirgin@gmail.com wrote:
Hi Erik, I really love the WikiWand design. The big image at the top,
the
larger images throughout, the pale-grey boxes for block quotes, white
space,
larger fonts, different fonts. It's very clean and inviting.
*nod* It's very nicely done. Though it's technically not a redesign but a separate site, so none of the change management issues come into play -- users who don't like it simply don't go there, and their experience
remains
unchanged, therefore no calls for heads on sticks etc.
We've made much more dramatic changes to the UX on mobile, where there's less user aversion to change. Check out the Night article on mobile. Note how images are already styled differently, and blockquotes are as well (different style of quotes, different typography). The measure is
narrower,
the font is larger, etc.
We've been gradually porting over these changes to desktop, starting with the typography (which is now default everywhere). Changes to images are next, and we'll hopefully get to the quote styling soon. Edge cases and
the
10% where things don't quite look right become much more important when going to desktop - hence moving carefully.
That said, you could take the mobile quotation style and port it over locally. -- Erik Möller VP of Engineering and Product Development, Wikimedia Foundation
Hi Erik,
The mobile design https://en.m.wikipedia.org/wiki/Night_%28book%29 looks fabulous, and I love that the block quotes have a different font.
I see that the quote https://en.wikipedia.org/w/index.php?title=Night_%28book%29&diff=prev&oldid=622808906 box I added toda https://en.wikipedia.org/w/index.php?title=Night_%28book%29&diff=prev&oldid=622808906y to Night around one of the block quotes – the one starting "He's just trying to make us pity him" – changed the font in the mobile article.
And again the images are interfering. You can see that the large quotation marks aren't showing up properly around the images.
There is something about the way images are presented on WP that causes a lot of problems, but I don't have the vocabulary to explain what I mean. But is there some way images can be "boxed off," so that no matter where they are placed they don't have these effects on the surrounding text?
For example, we could have a dedicated sidebar running down the right side of the article that is only for images, infoboxes, etc, and it could also be left empty, so that images c ould be placed near the text they relate to. Then no matter what we do to text, it wouldn't affect the images, and vice versa. A sidebar on the right would have the added benefit of shortening the lines of text.
Sarah
Design mailing list Design@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/design