background preloader

UI/UX

Facebook Twitter

Web Design is 95% Typography. By Oliver Reichenstein 95% of the information on the web is written language. It is only logical to say that a web designer should get good training in the main discipline of shaping written information, in other words: Typography. Back in 1969, Emil Ruder, a famous Swiss typographer, wrote on behalf of his contemporary print materials what we could easily say about our contemporary websites: Today we are inundated with such an immense flood of printed matter that the value of the individual work has depreciated, for our harassed contemporaries simply cannot take everything that is printed today.

It is the typographer’s task to divide up and organize and interpret this mass of printed matter in such a way that the reader will have a good chance of finding what is of interest to him. With some imagination (replace print with online) this sounds like the job description of an information designer. Typography has one plain duty before it and that is to convey information in writing. Books. What Is User Experience Design? Overview, Tools And Resources - Smashing Magazine. Advertisement Websites and Web applications have become progressively more complex as our industry’s technologies and methodologies advance. What used to be a one-way static medium has evolved into a very rich and interactive experience. But regardless of how much has changed in the production process, a website’s success still hinges on just one thing: how users perceive it.

“Does this website give me value? Is it easy to use? Is it pleasant to use?” User experience design is all about striving to make them answer “Yes” to all of those questions. What Is User Experience? User experience (abbreviated as UX) is how a person feels when interfacing with a system. Those who work on UX (called UX designers) study and evaluate how users feel about a system, looking at such things as ease of use, perception of the value of the system, utility, efficiency in performing tasks and so forth. UX designers also look at sub-systems and processes within a system.

Why Is UX Important? Complex Systems. 35 Excellent Wireframing Resources - Noupe Design Blog. Oct 05 2010 Wireframing is an important part of the design process, one that shouldn’t be overlooked by even the most experienced designers. Wireframes can save development time by outlining exactly how a site should look and function, in a manner that can be shown to and approved by your clients. But wireframing can be confusing, especially to new designers. What’s the right way to create a wireframe?

Wireframing Articles The articles featured here discuss wireframing and prototyping both from a theoretical and a practical point of view. My Five Commandments for Wireframing A podcast and article from Boagworld on good practices for wireframing, including why you should wireframe and the benefits of paper wireframing. Wireframes for the Wicked Here’s a slideshow that talks about the purpose of wireframes and the different types of wireframes. The Future of Wireframes? UX 101: The Wireframe A beginner’s guide to wireframing from Viget Advance. Storyboards vs.

Wireframes vs. 25 Classic Fonts That Will Last a Whole Design Career. Eric Gill, Adrian Frutiger and Max Miedinger are names we associate with the classic typefaces designers use on a daily basis. Their font creations are timeless designs that look right at home no matter what century we’re in. This collection of 25 classic fonts is a round up of the best and most popular fonts every designer should own.

You can be sure that they will last your whole design career. Who hasn’t heard of Helvetica? It’s probably the most recognised classic typeface. Originally designed 1957 by Swiss designer Max Miedinger and Eduard Hoffmann Bodoni is a serif typeface designed by Giambattista Bodoni in 1798. Clarendon is a fantastically fat slab serif, created by Robert Besley in 1845. Akzidenz Grotesk was designed in 1896 by the H. Avenir is a geometric sans-serif typeface designed by Adrian Frutiger (recall the name? FF Din is a relatively new typeface compared to the veterans mentioned so far with it being created in 1995 by Albert-Jan Pool.

Remember Adrian Frutiger? 10 Usability Tips Based on Research Studies. We hear plenty usability tips and techniques from an incalculable number of sources. Many of the ones we take seriously have sound logic, but it’s even more validating when we find actual data and reports to back up their theories and conjectures. This article discusses usability findings of research results such as eye-tracking studies, reports, analytics, and usability surveys pertaining to website usability and improvements. You’ll discover that many of these usability tips will be common sense but are further supported with numbers; however, some might surprise you and change your outlook on your current design processes. 1. The idea that users will get frustrated if they have to click more than three times to find a piece of content on your website has been around for ages.

Logically, it makes sense. But why the arbitrary three-click limit? In fact, most users won’t give up just because they’ve hit some magical number. Source: User Interface Engineering Sources and Further Reading 2. 4 Best User Interface Pattern Libraries | UXMovement.com. By anthony on 09/13/10 at 2:45 pm As designers, sometimes we need a little inspiration to get our creative juices flowing. Looking at examples of different user interface patterns could give us the ideas we need to design something amazing. That’s why I put together four of the best user interface design pattern libraries around the web. I have searched and looked at dozens.

But these four, I believe, offer the best examples with the best navigations for browsing. The first two offer patterns only. Elements of Design Pattern Tap Patternry UI Patterns. UX. Web Wireframe Kit. Linowski.ca. Interactive Sketching NotationHelping you tell better stories of interactionPurchase & Download for $44 CAD Watch: How I Sketch - An Intro The Interactive Sketching Notation is a visual language which enables designers to tell more powerful stories of interaction.

Through a few simple rules, what the user sees (drawn in greyscale) and does (drawn in red) are unified into a coherent sketching system. Intended for Adobe Illustrator, but friendly towards Photoshop & Balsamiq. Less DocumentationHaving merged flows, user stories, sketches and wireframes into one document, it is easier to maintain your work with the notation.

Inside the Template - version 1.5 Icons: 100 common interface sketch style icons for faster concepting Components: various predesigned components and elements ready for dragging and dropping ISN + MicroPersonas Bundle for $59 Get the Interactive Sketching Notation + MicroPersonas at a discount. 52 Weeks of UX. UX Myths. Nine web design horrors. UI-patterns.com. Designpatterns. Pattern. Gui. Usability. Interface Design. User Interface - Stack Exchange.