Brent Sordyl’s blog

Creating icons is a lot of work, but today you can download more than 500!
(Link: 500 Free Icons for your web apps | TCA inspired design)

Uncategorized icons, webdesign

The article covered the basics of the most common table patterns and some live examples. If I missed something please let me know! I also recommend you reading two more articles about tables: Big Table issue that tries to find an solution for tables that are so big they no longer fit in the viewport, and 15 Tips for Designing Terrific Tables that shows many different contexts in which tables can be used.
(Link: Ultimate guide to table UI patterns)

Uncategorized tables, webdesign

ScreenSketcher is a tool for creating quick mock-ups, or wireframes, of a computer user interface, such as a window, a web page, or anything that can appear on a computer screen.
(Link: ScreenSketcher – create enlightened user interface mock-ups)

Uncategorized webdesign, wireframes

Today i’ve collected 38 PSD to Html/CSS tutorials for you my friends and hope all of them will help you to learn coding and converting PSD to HTML/CSS.
(Link: 38 Great Tutorials To Convert PSD To HTML/CSS |)

Uncategorized psd, webdesign

(Link: crowdSPRING – Logo Design and Custom Graphic Design Design by the World’s Best Creative Department)

Uncategorized crowdsourcing, design, freelance, webdesign

Armed with a crazy amount of examples, we distilled the patterns into six principles:

* Make It Direct
* Keep It Lightweight
* Stay in the Page
* Provide Invitations
* Use Transitions
* React Immediately
(Link: Rich Internet Application Screen Design | UX Magazine)

Uncategorized webdesign

As a designer, color management should be an integral part of your workflow. A website’s color scheme helps shape its identity and therefore should not be carelessly thrown together. Here are 25 online, desktop and iPhone applications to help you live and breathe color management no matter where you are.
(Link: 25 Awesome Tools for Choosing a Website Color Scheme | Design Shack)

Uncategorized color, webdesign

Though grid layouts may not be new to print design and certainly not design in general, CSS grid systems are still somewhat new to the field of web development. CSS grid systems allow the developer to easily and quickly markup and create structured, grid styled websites and layouts. Each grid systems has its pros and cons, and different ways of accomplishing goals. Today, we’ll review 10 amazing CSS grid systems.
(Link: Check out these 10 awesome CSS grid systems)

Uncategorized css, frameworks, webdesign

20 Guiding Principles for Experience Design
1. Stay out of people’s way
2. Present few choices
3. Limit distractions
4. Group related objects near each other
5. Create a visual hierarchy that matches the user’s needs
6. Provide strong information scent
7. Provide signposts and cues
8. Provide context
9. Avoid jargon
10. Make things efficient
11. Use appropriate defaults
12. Use constraints appropriately
13. Make actions reversible
14. Reduce latency
15. Provide feedback
16. Use emotion
17. Less is more
18. Be consistent
19. Make a good first impression
20. Be credible and trustworthy
(Link: So you wanna be a user experience designer — Step 2: Guiding Principles)

Uncategorized usability, ux, webdesign

Flows are made out of individual interactions. A screen offers some possibilities and the user chooses one. Then something happens, and the screen changes. It’s an ongoing conversation. Each moment in a flow is like a coin with two sides. The screen is showing something on one side, and the user is reacting on the other side. My flow diagrams illustrate this two-sided nature with a bar. Above the bar is what the user sees. Below the bar is what they do. An arrow connects the user’s action to a new screen with yet another action.

Here’s a simple and concrete example. To add a to-do item in Basecamp, first you go to a list. Then you click to “Add an item.” The form appears. You fill in the item content and submit the form, and if your submission is valid, the item appears and flashes yellow. Here’s a shorthand version of this flow:
(Link: A shorthand for designing UI flows – (37signals))

Uncategorized design, ui, usability, webdesign

Appropriate Fidelity

“Appropriate fidelity” refers to a level of prototype fidelity that allows you to achieve the goals you’ve set for doing a prototype in the first place. By varying the fidelity of your prototype along the dimensions of visual design and functionality, you make your prototype more effective at achieving some goals and less effective for others.

bottom left Low Visual and Low Functional Fidelity

Very low fidelity prototypes are extremely useful to UX designers. Why? They can be made swiftly, changed without repercussion, and still help visualize a concept. Low visual & functional fidelity prototypes are helpful at answering large structural questions. Here are some examples:

* Does the system have all the features required to support the user’s goals?
* Does the workflow make sense at a high level?
* Which UX concept works best?
* Coming to consensus on a UX concept with stakeholders, e.g.”Is this what you meant?”
(Link: Integrating Prototyping Into Your Design Process – Boxes and Arrows)

Uncategorized prototyping, webdesign

# Home page usability: 20 guidelines to evaluate the usability of home pages.
# Task orientation: 44 guidelines to evaluate how well a web site supports the users tasks.
# Navigation and IA: 29 guidelines to evaluate navigation and information architecture.
# Forms and data entry: 23 guidelines to evaluate forms and data entry.
# Trust and credibility: 13 guidelines to evaluate trust and credibility.
# Writing and content quality: 23 guidelines to evaluate writing and content quality.
# Page layout and visual design: 38 guidelines to evaluate page layout and visual design.
# Search usability: 20 guidelines to evaluate search.
# Help, feedback and error tolerance: 37 guidelines to evaluate help, feedback and error tolerance.
(Link: 247 web usability guidelines)

Uncategorized checklist, usability, webdesign

Super-easy Wireframing
Create and collaborate interactive mockups for your software and websites.
MockFlow helps to design interactive UI mockups for Desktop Software, Rich Internet Apps and Web sites.
(Link: MockFlow – Easy Wireframing for Software and Websites)

Uncategorized mockup, tweet, webdesign, wireframes

Myth #5: Can’t Decide? Make it a Preference
“Every preference which is not really needed is a design choice that I’m offloading to all the users of my product or service.”
(Link: Top 10 UX Myths)

Uncategorized ux, webdesign

The first thing that happens when I get an enquiry is I send the potential client a website planner. The website planner, a series of questions I have listed in a Word document, will gather requirements for the project.

The key objectives of the planner:

* Find out who the client is and what they do
* Who their target market/user is
* Who their competition is
* What deliverables they want from me
* Timeframe and budget

In a nutshell, NGD require a makeover with a modern & easy to use interface. I am responsible for the XHTML/CSS templates for the main pages (they already have a development team in place for the back-end programming & intagration).
(Link: The Web Design Process Start to Finish)

Uncategorized scoping, webdesign