Designing A Rocket Icon In Adobe Fireworks

Many people know that Fireworks is a great tool for web design, prototyping and UI design. But what about icon design? Icon design is a very specific skill that overlaps illustration, screen design and, of course, visual design. An icon designer needs to understand lighting, proportions and, most importantly, the context of the icon itself.

Designing A Rocket Icon In Adobe Fireworks

The BBC published an interesting article about icon design and skeuomorphism one year ago, titled "What Is Skeuomorphism?" It’s definitely worth reading because it explains why icons often reflect the real world and the thinking behind it.

Read more...

Part Three Design Principles: Connecting And Separating Elements Through Contrast And Similarity

Similarity and contrast, connection and separation, grouped and ungrouped are all ways to describe the varying sameness and difference between elements. Based on the information they carry, we’ll want some elements to look similar, to indicate that they are related in some way. We’ll also want to show that some elements are different and belong to different groups.

Design Principles: Connecting And Separating Elements Through Contrast And Similarity

Key to showing both is the visual characteristics of elements and their relationships. If two elements are related in some way, then they should show similar visual characteristics. If the elements are different, then they should look different.

Read more...
Advertisement Advertise with us!

Prototyping For Better Products, Stronger Teams And Happier Clients

As mobile designers, we have a stark decision to make: do we spend time learning new tools and changing our design processes to create our own transitional interfaces, or are the tools that we've been using good enough? There's an old writing adage that advises writers, whenever possible, to “show, don't tell” when bringing characters to life. The goal is to reveal the story through the character’s experiences instead of the author’s.

Prototyping For Better Products, Stronger Teams And Happier Clients

When designing mobile products, we share a similar burden. Dammed up inside our heads are creative waterfalls of fresh interactions, transitions, and animations. But how are we supposed to communicate them to our teams, our developers? How do we get them out of our heads? Through a game of charades?

I’m guilty of that last one.

Read more...

Efficiently Simplifying Navigation, Part 3: Interaction Design

Having addressed the information architecture and the various systems of navigation in the first two articles of this series, the last step is to efficiently simplify the navigation experience — specifically, by carefully designing interaction with the navigation menu.

Efficiently Simplifying Navigation, Part 3: Interaction Design

When designing interaction with any type of navigation menu, we have to consider symbols, target areas, interaction event, layout, levels, functional context. It is possible to design these aspects in different ways. Designers often experiment with new techniques to create a more exciting navigation experience. And looking for new, more engaging solutions is a very good thing.

Read more...

Why Companies Need Full-Time Product Managers (And What They Do All Day)

What is a product manager? What do product managers do all day? Most importantly, why do companies need to hire them? Good questions. Well, the first confusion we have to clear up is what we mean by "product."

Why Companies Need Full-Time Product Managers (And What They Do All Day)

In the context of software development, a product is the website, application or online service that users interact with. Depending on the size of the company and its products, a product manager could be responsible for an entire system (such as a mobile app) or part of a system (such as the checkout flow on an e-commerce website across all devices).

Read more...

Essential Visual Feedback Tools For Web Designers

The creative process takes a lot of time, and web designers know it. When you factor in feedback from clients, the process takes even longer: numerous emails, revision notes, chats and meetings — that's what it normally takes to find out precisely what the client wants.

Essential Visual Feedback Tools For Web Designers

Fortunately, today's web provides various solutions to optimize the communication process. The first web services that allow users to report bugs on web pages appeared several years ago. Since then, tools and technologies have emerged to make the process more convenient and user-friendly. Today’s market offers several useful useful products for visual bug-tracking, each with its pros and cons.

Read more...

Making Modal Windows Better For Everyone

To you, modal windows might be a blessing of additional screen real estate, providing a way to deliver contextual information, notifications and other actions relevant to the current screen. On the other hand, modals might feel like a hack that you’ve been forced to commit in order to cram extra content on the screen. These are the extreme ends of the spectrum, and users are caught in the middle. Depending on how a user browses the Internet, modal windows can be downright confusing.

Making Modal Windows Better For Everyone

Modals quickly shift visual focus from one part of a website or application to another area of (hopefully related) content. The action is usually not jarring if initiated by the user, but it can be annoying and disorienting if it occurs automatically, as happens with the modal window’s evil cousins, the “nag screen” and the “interstitial.”

Read more...

Are Your Internal Systems Damaging Your Business?

The internal systems of many organizations have shocking user interfaces. This costs companies in productivity, training and even the customer experience. Fortunately, we can fix this.

Are Your Internal Systems Damaging Your Business?

"How come I can download an app on my phone and instantly know how to use it, yet need training to use our content management system? Shouldn’t our system be intuitive?" This was just one of the comments I heard in a recent stakeholder interview. People are fed up with inadequate internal systems. Many of those I interviewed had given up on the official software. Instead, they use tools like Dropbox, Google Docs and Evernote.

Read more...

Dropbox’s Carousel Design Deconstructed (Part 2)

Many of today’s hottest technology companies, both large and small, are increasingly using the concept of the minimum viable product (MVP) as way to iteratively learn about their customers and develop their product ideas. This two-part series, looks into the product design process of Dropbox’s Carousel.

Dropbox’s Carousel Design Deconstructed (Part 2)

Part 1 covered the core user, their needs and Dropbox’s business needs, and broke down existing photo and video apps. This second part is about Carousel’s primary requirements, the end product, its performance and key learnings since the launch.

Read more...

Creating Clickthrough Prototypes With Blueprint

In a previous article, I discussed using POP to create sketch-based clickthrough prototypes in participatory design exercises. These prototypes capture well the flow and overall layout of early design alternatives.

Create Clickthrough Prototypes With Blueprint To Communicate Design Concepts

The same piece briefly mentioned another category of clickthrough prototypes: widget-based mockups that are designed on the target device and that expand on sketches by introducing user interface (UI) details and increased visual fidelity. These prototypes can be used to pitch ideas to clients, document interactions and even test usability. In this article, I will teach you how to use the iPad app Blueprint to put together such prototypes in the form of concept demos, which help to manage a client’s expectations when you are aligning your visions of a product.

Read more...

↑ Back to top