background preloader

UX Techniques

Facebook Twitter

PowerPoint Resume Layout Tips. I know I said I was going on hiatus, but I just I got a nice email from a reader today complimenting me on the layout of the blog…thanks Janet!

PowerPoint Resume Layout Tips

She also asked a question about my old online resume PDF: In particular your resume’s design caught my attention. Wireframing in Powerpoint? It Works! It’s important for designers to translate the ideas in their heads into a tangible form that stakeholders can relate to.

Wireframing in Powerpoint? It Works!

Prior to writing any code, wireframes are a great way to quickly map out the functionality and flow of a website or application. This helps anticipate conflicts (“That's not what I had in mind") early in the process, at a point where they are painless to correct. Dedicated wireframing tools are in abundance, so you might be surprised that my weapon of choice for sketching wireframes is Microsoft PowerPoint. PowerPoint makes it possible for stakeholders and non-techies to participate in the design process. When exchanging PowerPoint slides over email, you can be fairly certain everyone will be able to view and edit them. User Experience. InVision Prototyping Tool. November 11th, 2011 Here comes InVision, a simple click-through prototype building app. The tool itself is pretty light (in a good way) in that you do not design the actual pages in InVision. Instead, the idea is to design your screens in your other weapons of choice (Fireworks, Illustrator, Balsamiq, Photoshop etc.) and then upload them into InVision.

Once you upload your GIFs, PNGs, or JPGs, the tool then allows you to create hotspots and link pages together. When creating these hotspots, you also are provided with a very useful ability to save them into templates for easier reusability. InVision also comes with a few standard collaboration features. One thing which becomes immediately apparent when using this is that a good amount of effort has also been put into designing the sleek interface. Fireworks Wireframing Kit - Part 3. Tiny Status Bar After taking a few days off from publishing an awesome Adobe Fireworks wireframes and kits due to Christmas season, here is another freebie for you to enjoy, a tiny status bar wireframe!

Preview Download Kit Breadcrumbs Simple and useful breadcrumbs contributed by Thierry Teyssier . Awesome! Calendar. Wireframes Magazine. 1 pixel line in Adobe Fireworks. 1-pixel lines are very common in all designs but on the other hands it might be not very safe to use them. How to draw lines Typically you draw lines with the Line tool and set the stroke from the category dropdown menu: usually you choose either Soft or Hard lines. See Figure 1. Figure 1: Set the stroke category Soft lines and Hard lines.

4 Essential Extensions for Adobe Fireworks - Pixel rendering in Adobe Fireworks. Overview Visually all you can see on your monitor screen are the pixels and the nodes but pixel rendering (or vector or line rendering) is a complex process involving a lot of elements. We will see what is happening under the hood and we hope it will be a big help to clearing up the confusion about pixel precision in Fireworks. Before we can get the whole picture we are going to lay principles and definitions. The following elements are participating in the vector rendering process: The coordinate grid, the screen monitor grid, the nodes (or anchors or handles), path, contour, rasterization, half pixel, whole pixel, sub pixel and pixel. Coordinate grid vs monitor grid. A Case for Adobe Fireworks against Photoshop and Illustrator. I’ve been a full-on Fireworks user now since the first release way back when it was owned by Macromedia.

A Case for Adobe Fireworks against Photoshop and Illustrator

What Fireworks offered then is still as true today. A true web design environment with the right tools to do the job you want. Change on a Dime: Agile Design. What does it mean to have a good experience?

Change on a Dime: Agile Design

Think of your favorite restaurant, the interior of your car, and the software on your phone; how do people craft these experiences? Introduction to Design Studio Methodology. Animating paper prototypes using stop motion. Jonathan (@first_day) is a tech-focused jack of all trades and the editor-in-chief of UX Magazine.

Animating paper prototypes using stop motion

He is also the author of Effective UI: The Art of Building Great User Experience in Software, published by O'Reilly Media. Through its partnership with UX Magazine, Jonathan is also a senior advisor to Didus, a recruiting and career development company focused on user-centered professionals. As well, Jonathan is Managing Director, Product Strategy & Design for Dapperly, a fashion-oriented software product startup, and he is the Principal of First Day, a small private equity and consulting company. Is the Sitemap Losing Its Client-Facing Steam? Lately, I have found myself questioning the effectiveness of the traditional sitemap as a stakeholder-facing deliverable.

Is the Sitemap Losing Its Client-Facing Steam?

The main goal of a site map is to provide a holistic look at a site’s (or application’s) structure—that is, to answer the big question of “What goes where?” These days, however, site structures are not as simple as they were in the early days of the Web, and the “positions” of pages, functions, etc., are not so cut and dry. As the Web has evolved to include larger, more complex sites, it has become increasingly difficult to create sitemaps that stakeholders and clients can interpret with speed and ease.

The Sitemap: A Quick Primer A sitemap is the first tangible step towards the creation of a site. Building a website of any scale without having any of this documentation is a bad idea.