 Your new post is loading...
|
Scooped by
Robin Good
|
In “Storytelling in Web Design,” I explained the three most basic aspects of storytelling — character, setting, and action — and offered ways to begin including storytelling in web design using basic design elements..."
Via Gregg Morris, Karen Dietz
|
|
Scooped by
Robin Good
|
Gridset is a tool that allows you to create sets of grids for your site.
|
|
Scooped by
Robin Good
|
|
|
Scooped by
Robin Good
|
Not every designer gets the chance to work on a high-profile redesign. In fact, the vast majority will never have that chance. At least not officially. But
|
|
Scooped by
Robin Good
|
This article explains why, when designing for the reading experience, we shouldn't assume anything but learn everything we possibly can in order to establish a solid design concept.
|
|
Scooped by
Robin Good
|
Robin Good: If you are looking for a web prototyping solution and wondering which other alternatives are available out there, the newsroom team at Usertesting.com has put together a truly great infographic guide, that showcases the best prototyping, wireframing and web site simulation tools.
From the official site: "If you’re into building websites, mobile sites, or apps, you probably use some type of mockup tool—prior to coding—to help you envision how a site will work and look.
But do you get customer feedback on them? In this ultimate guide, we’ll explore leading mockup tools — wireframing, prototyping, and simulating –and show you how to run user tests with them."
Informative. Resourceful. Well designed. 8/10
Full guide infographic: http://www.usertesting.com/blog/2012/10/23/the-ultimate-wireframing-tools-guide/
|
|
Scooped by
Robin Good
|
Robin Good: If you are looking for free tools that can help you draft the design of your web site or application, look no further as this is a good collection providing ten wrireframing alternatives.
Definition of Wireframe:
A wireframe is a visual illustration of one Web page. It is meant to show all of the items that are included on a particular page, without defining the look and feel (or graphic design).
It’s simply meant to illustrate the features, content and links that need to appear on a page so that your design team can mock up a visual interface and your programmers understand the page features and how they are supposed to work.
Source: usability.gov
Full guide: http://speckyboy.com/2010/01/11/10-completely-free-wireframe-and-mockup-applications/
|
|
Scooped by
Robin Good
|
Robin Good: If you are considering adopting a web design responsive solution to make your web site fully compatible with any type of screen and mobile device, you may want to give a good read to this excellent guide by Slavik Volinskion SEOMoz, which highlights all pros and cons of adopting this approach. Both from a design-usability and from a SEO viewpoint.
SEOMoz: "Responsive design is not a one-size-fits-all solution to mobile.
According to the author of the Responsive Web Design book, Ethan Marcotte: "But most importantly, responsive web design isn't intended to serve as a replacement for mobile web sites. [...] And as a development strategy, it's meant to be evaluated to see if it meets the needs of the project you're working on."
Must-read: 8/10
Full guide: http://www.seomoz.org/ugc/responsive-web-design-the-ultimate-guide-for-online-marketers
(via Brian Yanish)
|
|
Scooped by
Robin Good
|
Robin Good: With the free Keynotopia Mockup Bundle, you can draft, edit and sketch highly-detailed elements of a user interface while using only Apple Keynote (but don't fret. There are libraries and themes also for PowerPoint and other presentation tools).
The Keynotopia Mockup Bundle includes:
-> Over 1,000 vector user interface components designed entirely in Apple Keynote. The following templates are included in the bundle:
->> iPhone Mockup Templates
->> iPad Mockup Templates
->> Android Mockup Templates
->> BlackBerry Mockup Templates
->> Web Application Mockup Templates
->> Facebook Mockup Templates
->> OS X Mockup templates
->> Windows 7 Mockup Templates
->> Windows Phone Mockup Templates
"Keynotopia is the largest collection of user interface design templates that enable you to prototype and test your app ideas in 30 minutes or less using Apple Keynote, Microsoft PowerPoint, or OpenOffice Impress.
The templates include thousands of wireframe and high fidelity vector UI components, meticulously designed from scratch in Keynote, Powerpoint and OpenOffice, and fully editable and customizable without needing additional design tools."
The Keynote Mockup Templates Bundle is available in exchange for a simple tweet (normally they are $49).
Find out more: http://keynotopia.com/keynote-mockups-templates/
Templates and Themese Gallery: http://keynotopia.com/themes/
|
|
Scooped by
Robin Good
|
Robin Good: If you are looking to understand how to create and manage those pop-up content windows that while dimming the stuff in the background, offer you an elegant peek at what you have clicked upon, this guide by Greg Bates will definitely provide you with all of the basic info you need.
What are modal boxes? What's the difference between Modal and Modeless? How can they be used? Where can I find some sample scripts to start using and experimenting with them?
Informative. Resourceful. 8/10
Full guide: http://webdesign.tutsplus.com/articles/modal-and-modeless-boxes-in-web-design/
|
|
|
Scooped by
Robin Good
|
|
|
Scooped by
Robin Good
|
Generate a color palette from PNG, JPG or GIF image/photo. Receive color suggestions, download Photoshop swatches (.ACO)
|
|
Scooped by
Robin Good
|
Build high-fidelity fully interactive mobile app prototypes in minutes. Prototypes can be viewed on browser or device giving a real experience to the user how the app will look like and behave.
|
|
Scooped by
Robin Good
|
They say a picture is worth a thousand words. True or not, images are an important part of any website we create. Since it is so easy to embed an image in a website (even the process of creating your
|
|
Scooped by
Robin Good
|
|
|
Scooped by
Robin Good
|
|
|
Scooped by
Robin Good
|
|
|
Scooped by
Robin Good
|
Robin Good: A great short video from PBS brings together the views and opinions of three great web designers: Jason Santa Maria, Jeffrey Zeldman, Whitney Hess.
From BoingBoing.net: "The explosion of the internet over the past 20 years has led to the development of one of the newest creative mediums: the website.
Web designers have adapted through the technological developments of html, CSS, Flash, and JavaScript, and have mastered the balance between creativity and usability.
Now with the advance of mobile, the greatest websites have taken user experience and responsive design to the next level, and continue our evolution from print to a digital world."
Good stuff. Interesting. 8/10
Original video: http://youtu.be/3iVVM_DgWY4
|
|
Scooped by
Robin Good
|
Robin Good: If you like to go back to pen and paper to draw your sketches, rather than launching the latest web prototyping tool, you are probably still doing the best thing.
As Milos Nedved writes on 1stwebdesigner: "...analog methods of prototyping are especially valuable right at the beginning of projects – when speed matters the most.
Working with paper, or perhaps a whiteboard, can accelerate the speed of our learning loops.
Sketch, feedback, sketch, feedback, sketch feedback – you can go through dozens of iterations in one day and you’ll set solid foundations for the rest of the work.
Consider it kind of premium insurance. Getting rough feedback quickly can save you a lot of work."
The article contains a short review of a set of analog, paper-based, web design/ mobile prototyping tools.
Useful. 8/10
Full article: http://www.1stwebdesigner.com/design/paper-prototyping-analog-tools-web-mobile-designers/
|
|
Scooped by
Robin Good
|
From the official guide: "This document defines formatting and style rules for HTML and CSS.
It aims at improving collaboration, code quality, and enabling supporting infrastructure.
...like other Google style guides, deals with a lot of formatting-related matters.
It also hints at best practices so to encourage developers to go beyond indentation.
Many style guide authors know the underlying motivation from the question whether to describe the code they write—or to prescribe what code they want to write. Not surprisingly then, in our HTML and CSS style guide you’ll find both (as much as you’ll still find a lot of different development styles in our not entirely small code base)."
Full Guide: http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml
|
