How to Create Design Concepts in Rapid Fashion
Sometimes you need to get a bunch of ideas in a short amount of time. Its not always easy for one person alone (though easier for some than others). Collaboration is key whether it be collectively or individually within a working group of people. Team design is one of the benefits of working in an agency or inhouse studio.
In borrowing from an idea that originally began in partnership with some of my former colleagues, the design team at Viget recently embarked on our first Design Flash Mob (DFM). You may have heard the term 'flash mob' to describe wacky collaborative events such as massive pillow fights where a large group of people gather in a single place, fight each other with pillows and leave with a pile of feathers on the ground as a residual reference to the event. The basic steps of these events are as follows:
- Plan and promote in advance of the event. What do you hope to accomplish? When and where should this take place?
- Gather at the designated time and place.
- Act upon on what you set out to do.
- Disperse and reflect on the madness.
In the spirit of design synergy we can take these steps and use them to collaborate quickly on things like logo designs, t-shirt ideas or rethinking user experience problems. Plan to do something about a week out. Think ahead about what you might want to create. When the time comes you'll be ready to jump in and start designing in a rapid but refined way. Take a morning or afternoon to hold the event. At the end, take time to talk about it and share different perspectives on working under pressure.
Another important aspect of a design flash mob is that it should not be treated as a competition. Even if one design is to be chosen it should be a democratic effort including those who played a part in the event. Benefiting the greater good should be the goal. In effect, the whole is greater than the sum of the parts.
One great place to start with a DFM is to have several people participate in designing desktop wallpapers. They're simple to design in a short period of time and have no production costs associated with them. This is where we started on our first Viget DFM. The assignment was simple. Take an afternoon (roughly 4 hours) to assemble one or more desktop wallpapers within the given time and include the Viget brand no matter how big or how small. Everything else was left up to the designer's discretion. Planning ahead was ok but no one was allowed to begin until the start of the event. Additionally, you didn't have to be a designer to participate. Our design team consists of UX designers, visual designers and production specialists with a wide range of talents and skills. How you work within the guidelines is all that matters.
Continue reading "How to Create Design Concepts in Rapid Fashion"
Displaying Related Categories in ExpressionEngine
While working with ExpressionEngine on a client project, Doug Avery and I ran across a problem. We had a weblog full of articles, and we wanted to show a list of related articles on single entry pages. The key was using EE's related_categories_mode parameter, which pulls back entries based on categories in the entry.
The problem was that you can't nest weblog tags...so, the related categories tag had to sit outside of the articles weblog entries, and we needed a way to tell EE to only display the related articles at the bottom of full article pages.
This is easy enough if you just want to output them as standalone tags (for example, a group of repeating links), but gets tricky if you want to add a header, or place them as LIs inside a UL. Any markup outside the related_categories_mode weblog tag remains even if no articles are returned, meaning empty UL's and headers were showing up beneath every entry on the blog's index page.
We knew we wanted the UL and H3 to appear inside the tag, but in EE, everything inside a weblog tag repeats with each entry. With the H3 placed inside the tag, our full article pages were showing one header and one UL for each link which looks totally ridiculous.
The solution (which I largely credit to Doug) is to use a few simple IF statements to figure out when an article is the first/last in a list, and add then the necessary markup:
{exp:weblog:entries related_categories_mode="on"}
{if count == "1"}
<h3>Related Articles</h3>
<ul class="relatedArticles">
{/if}
<li>
<a href="{title_permalink="articles/"}">{title}</a>
</li>
{if count == total_results}
</ul>
{/if}
{/exp:weblog:entries}
Typography Tuesday: Hierarchy
Unlike print, the web is interactive; establishing a visual hierarchy through typography is essential in guiding the user to the information they are seeking online. Visual Hierarchy is the arrangement of elements in a gradual series in order of importance, enticing users to interact with a web site through visual cues. Typography online is less an element and more an interface, where characteristics such as size, weight, style, color, and location help the user to navigate the site through emphasis.
Typography Tuesday: Legibility
What is Typography Tuesday?
It is no secret that I love Typography. Typography is the cornerstone of design. In situations that don’t afforded the luxury of other graphical elements such as photography or illustration, typography can carry the design. Strip away all the bells and whistles of the web and you are left with type; make that type look fantastic under aggressive circumstances and THAT is bad-ass.
Back in February, I had the pleasure of speaking about web typography at DC Design Talks. I learned a lot of great things while developing the presentation, and I’ve tried to simplify some of those ideas to share with you each Tuesday until I run out. (Which could, theoretically, be never.)
Why Must The Shoemaker’s Children Go Without Shoes?
In a day and age when anyone can have a web site (or a blog), many designers just don’t take very simple steps to get their own brand online. A series of conversations I have had with fellow designers—and this AIGA article (which focuses on traditional marketing rather than online marketing)—have led me to ask, "Why don’t more designers market themselves online? Why don’t more have any sort of online presence?"
My college education included a heavy dose of "self promotion" projects; then, I got a second education in online word-of- mouth marketing while working at a PR firm. Over time, I have explored this avenue less for myself and more as a test bed. I’ve found that my site is the perfect way to be able to relate to clients trying to get off of the ground. Why? Because I can honestly say what worked—and what didn’t—for me, both personally and professionally.
When I tell a client, "I totally feel ya," I mean it. It makes understanding the client’s position on a project a whole lot easier.
Continue reading "Why Must The Shoemaker’s Children Go Without Shoes?"
How To: Make the Viget Inspire Background
A few of you have been asking, so here it is: An overview of how we put the Viget Inspire background together. The driving philosophy behind real-texture stuff like this is to fake as little as possible. No matter how many brushes you have or how good you are in Illustrator, there's a quality of unpredictability in real photographs and real, physical elements that adds great subtle qualities to any design.
After coming up with the concept of the sunrise/hikers, the next step was to find two real images to craft it from. We needed a real skyline with a row of trees, and a real bed of watercolor effects with the kind of subtle variations watercolors do best. The two lucky candidates were found on iStock.
The first step was to divide that beautiful photo up into three distinct, flat blocks that we can manipulate further. The sky was easy (just chop around the mountains), but the trees a little more difficulty. Fortunately, with a collage like this, being hyper-detailed isn't too important...a rough cut-out of the trees on the left side and some guesswork on the right were good enough.
Continue reading "How To: Make the Viget Inspire Background"
Defining the Designer
What is it about designers? Who are we and why are we the way we are? Answers to these questions might come in many different forms. Like people in general, no two designers are alike. That being said, my guess is that just about anyone reading this will have an answer in some shape or form that describes someone they know who calls him or herself a designer. I’m not a psychologist nor do I claim to be an expert on defining designers but I can draw upon what I know about myself and offer my thoughts about other designers that I have met over the years.
Recent Comments
@Elliott: The beauty of mood boards is that they can run separate but concurrent with wireframes. If you think of wireframing as the ‘science’ of design in that it is structural and behavioral…
- Tom Osborne on 'Getting Moody: A Look at Inspiration and Style in Early Design Techniques'.
- Mindy on 'Switching Mindsets: From WordPress to ExpressionEngine'.
- Joomla Developer on 'Switching Mindsets: From WordPress to ExpressionEngine'.
Subscribe to Comments RSS