Clearly, the design and creation of man-made Christmas trees started long before the more versatile and multi-disciplinarily minded architects of recent generations got involved. The debate of the environmental impact of both cutting natural trees for the celebrations and using their artificial replicas that became popular in the 90s is ongoing. The best solution to avoiding the use of either of the controversial options (as recommended by environmentalist elves and Santa Claus himself) involves stylization and interpretation – something that architects and designers are very familiar with. Enjoy looking at these witty, sustainable, interactive design Christmas trees and have a wonderful holiday season everyone!

This is a guest post from Antonina of OpenBuildings - a community-driven and openly editable encyclopaedia of buildings from around the world. 

Studio Roso: V&A Christmas Tree

image:  Studio Roso

1024 architecture: Abies-Electronicus XMAS Tree

image: 1024 architecture

Ricardo Sanhueza De La Maza: (Green Bottle) Christmas Tree

image: Ricardo Sanhueza De La Maza

Sarah Wigglesworth Architects: Bermondsey Square Bicycle Christmas Tree

image: Mark Hadden

Ben Busche/Brut Deluxe Architects: Christmas Decoration in Madrid 2006/2007

image: Miguel de Guzman

Ben Busche/Brut Deluxe Architects: Christmas Tree on Gran Vía, Madrid

image: Miguel de Guzman

And some homey ideas…

Jane Schouten: Wall Application Tree

image: Jane Schouten

Richard Babcock: possibiliTree

image: possibiliTree

Büro North: Christmas Trees Frigg, Rindd & Ryder

image: Büro North

Vladimir Ivanov: Holey Tree

image: Vladimir Ivanov

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

10 Amazingly Designed Christmas Trees

This is a guest post from Tony Shin – with a double major in Economics and Management from the University of Washington, this Seattle native regularly contributes his work to several other publications. He has moved into social media and creative design in hopes to help lead and innovate the future of information with others. Follow him on Twitter and Facebook!

1. Design Blogs Compared

The imagination and creativity of designers are rare. They visualize expressions, colors and tones in such a way that it would take the average person weeks or months to illustrate what designers would in a matter of days. This infographic for One Extra Pixel breaks down some of the biggest design blogs and interestingly enough, the traffic that they get.

“Why the traffic?” Well, it’s quite simple. One key to a great blog is the design. The more or less subtle aesthetics of any site, large or small, can make the user experience that much better and the one thing that every blogger hopes for: organic traffic. It’s great that designers are continuously blogging about their designs. It’s a helping hand for all those bloggers frustrated with the design of their site. After all, a blogger treats their blog like a mother to her child. She cares for it so much and wants to see the child grow into someone great. Take a look at some of the best.

2. Never Leave Home Again

Imagine if you could accomplish everything from the comforts of your home, in your pajamas. Well, in this day and age, you pretty much can. But to visualize what that might look like, weighing out all the options, addressing the issues and concerns, College at Home put together this infographic. In all my time spent on the Internet, I’ve seen thousands of infographics. When I saw this one, my simple and humble reply was, “Wow. Nailed it.”

And they really did. The aesthetics of this infographic present the facts and stats that address some of the important things in life. I truly applaud the designer for this one. Among the thousands of infographics, there are few very that I am ever impressed with. This is definitely toward the top of my list. Take a look at the graphic and soak in the reasons to never leave home again.

3. The Evolution of the Long-Distance Relationship

Anyone who is in a long distance relationship can tell you, it’s tough. I’ve never been in one, nor do I ever plan to be in one, but I can only imagine the struggles. Your significant other is 3000 miles away and the only things you have to stay in touch are your phone and computer. This graphic for Rounds by Column Five Media shows just how far along those long distance relationships have come by illustrating the evolution of what it used to be like to what it’s become now. Hilarious.

4. 10 Reasons to Visit Tokyo

As if the mere thought of Tokyo wasn’t enough, Visual.ly put together this adorable looking graphic which highlights some of the biggest reasons why anyone should visit Tokyo. I really liked the design of the actual graphic along with the aesthetics that capture what Tokyo, and all it’s glory, is all about.

Of the 10 reasons, I think my favorite reason to visit Tokyo would be #6: Harajuku. The Gwen Stefani brand has completely intrigued and influenced the culture of hip hop and those who swear by it. It’s amazing to think about what sort of impact a brand like that has. To play a part in any culture, especially one as big as hip hop, steering the trend, alongside those awesome looking fanny packs, is very impressive and inspiring.

5. Cheaters

College is tough. I don’t remember how difficult elementary school was, but high school wasn’t nearly as tough as college. But I know it’s getting harder, which means students are stressing more. What does that result in? Cheating. This infographic from the team over at Online Masters Degree highlights some ridiculous statistics about cheating. Aside from the subject at hand, the aesthetics of the graphic really got to me. I mean, to incorporate standardized test sheets into the design of the title is purely ingenious. Not to mention the look of the graphic, which compliments and subtly reminds the reader what they’re reading about. Amazing. A great tip for all the designers out there!

As you may know by now, Inspired Magazine is a sucker for data visualization. That’s why we invited Tony Shin – a social media ninja and creative design samurai – to curate the weekly dose of infographics. If you like them as much as we do check out some of the older editions and follow Tony on Twitter and Facebook as well!

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

Infographics of the Week #10

As you may know by now, Inspired Magazine is a sucker for data visualization. That’s why we invited Tony Shin – a social media ninja and creative design samurai – to curate the weekly dose of infographics. If you like them as much as we do check out some of the older editions and follow Tony on Twitter and Facebook as well!

Designing The Cereal Box
I typically choose about 4-6 different unique infographics every week for this round-up. However, for this week only, I wanted to really highlight this graphic. If there was only one word I could use to describe designers, it would be ‘detail’. Every color, every line, even every pixel, receives more attention than a naked troll running around in New York City Time Square.

More or less, there’s a certain level of need every designer has to express themselves. Now, when and if that designer heads into the corporate world, it’s a completely different ballgame. In fact, the administrative overhead could be so large, the designer just might pop a vein and quit. This infographic by the Online Graphic Design Degree team illustrates just that. If you’ve heard the term ‘infographic’, you know what it looks like. It’s a design. Yes, there is text within the graphic, but it’s not some Microsoft Word document you can just start typing words into.

As the Internet world becomes more and more full of infographics, the corporate world becomes more and more exposed to them, understanding that an infographic can get their message across. So what do they do? Hire a designer. However, they may have unintentionally stepped into the wrong world. One they may just not have been ready for. Take a look and see how this humorous graphic illustrates exactly what a designer might experience. Heaven forbid.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

Special Infographic of the Week #9

This is a post by Xavier Veyrat – Entrepreneur, graphic designer, UI & UX designer – Co-founder of Hot Apps Factory and creator of App Cooker.

I would like to thank Inspired Magazine for letting us write our first article and let us share what we learned from 1 year and a half of hard work on App Cooker. I think we have some interesting points to share so let’s get started! Most of this knowledge comes from the Human Interface Guidelines, Apple’s introduction to iPhone videos, our sweat and some common sense.

There are two reasons for you to make an Application: for fun or for business. If your App is made for fun, just do it and don’t read this post. If it’s the other and you want to maximize your chances to make a living from your Apps, this is for you.

Be old-fashioned, don’t be foolish

Before getting hardcore on the design, the code and the communication, have a look at the type of application you want to do. Basically, we think there are two big categories: games and the others. If it is not a game, have a look at your competition, it is called “benchmarking”. Type the keywords of your idea in the App Store and have a look at the results. If you are serious about your idea, buy the apps of the competition. Even if you think you have the best idea out there, there are tons of brilliant people just like you who already have the idea or are currently working on the subject. Use them for a day or two, look at their functionality and pick up the top three. Then go to their App Store page and look at their reviews, this is where you can find some gold nuggets that might change the face of your App. You can use  Discovr Apps which has a great way of letting you discover similar apps (it isn’t perfect but much better than what the App Store provides). Another search on Google to find “work in progress” could also save you a lot of time.

Games are another world. If you want to benchmark similar games to your idea, you must have a solid bank account and this long process might affect the originality of your game. If you have a great concept for a game, the only way to stand out in this overcrowded category is to be original. Try to resist looking too hard at what’s already out there. This might unintentionally influence your direction and stifle your imagination and creativity. After this preliminary work, comes the most important moment in the life of your project, this is where you will have to confront the idea to the actual App.

The Idea VS the App

Having the idea is great but as soon as you get it, you start thinking that “this” would be nice to have and “that” feature would be awesome. The key thing here is to remember that you are going to make an App for a mobile device. That means a limited memory. That means you can’t do everything you want, which means you have to narrow the scope of your App to its core functions. We have seen a lot of developers and designers starting their ideas coding or drawing inside Photoshop and this is wrong, really wrong. Spend some time to define and refine your idea and you will reach the end of your project sooner.

So how do you select what’s in and what’s out? Well, this is where common sense and gut feelings start to play a role. With the exact same idea, you might find numerous ways of doing the App because the key features selected may not be the same from one team to another. This is the human factor. A great way to be sure that you manage to define your App idea correctly is to describe it in this form: “Differentiation” “Solution” for “Audience”. For example, “an easy to use” “photo editor” for “photographers”. This Application Definition Statement is the most important thing you have to do when your start an iOS project. Once you have clearly defined it, stick to it and ignore all the features that doesn’t fit to it.

Why should you start this awesome iPhone or iPad project?

Now that you have a clear idea of your App you are ready to code right? Nope, not yet… There is one more step to do before getting in the design and code process, it is the business model. How many developers have started an App and when they arrive on the App Store they are lost when it comes to set the price and their categories? Often they end up doing this part in seconds because they want to see their app on the store, trashing all their hard work in seconds.

Before everything, think about your business model and test some scenarios to evaluate the revenue generated from hard sales or a free App with in app purchase. There is an App for that called Price Cooker that can help you do the maths in a neat way. Don’t underestimate this part, changing from a paid app to a free app with in app purchase is not 1 hour of coding, but more like 1 week (in the best case scenario). Estimate the time you need to do the App, PAY yourself and look at the sales volume you will need to cover everything. When it comes to pricing, I am one of the believers that unless your company name is Rovio and you can sell millions of copies at $0.99, you should price your App higher than this. That way you will still have scope for promotion and more than anything it gives an indication of the quality of your App. There are countless Apps with nothing inside at $0.99 and customers are starting to realise that.

Do it the right way

When you get your idea clearly defined as well as your business model, it is now time to get your hands dirty. Here are some basic rules that may drive the way you work on your project.

• The design process should be 60 to 70% of the development time.
• Communicate about your App as soon as you get a Beta and get people involved in it.
• Communication is the key to selling your App
• Don’t think you have the best App on the App Store, the best App is the one that sells the most…
• In this shadowy century, standards are higher than ever people only want products they will love.
• Give love with your App, here at the Hot Apps Factory we strongly believe that targeting the heart of our users will always reap greater rewards than targeting their pocket.

As Jobs said during his speech at the Stanford University “stay young, stay foolish” and I would add “share your great ideas with people, you may not have the time to develop all of them”.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

HOW TO: Start “an App For That”

You’re creative. You’re talented. You want the world to see who you are and what you can do. But the world’s a big place, and it’s hard to stand out. If people can’t see your work, they won’t come knocking at your door. You need people to see what you’re all about, and that requires a strong, professional presence on the web. Luckily, there are online tools that can help you do that successfully.

You need an online portfolio.

It should be easy to find, easy to browse, and easy on the eyes. It should also be easy for you — to set up, update, and customize without taking up too much of your time. It’s easy enough to upload some images to a popular photo site like Flickr, but do you really want your gallery to look like 30 million others? Software packages like WordPress can be tweaked to look pretty, but do you have the time and know-how to maintain your own web server, configure PHP files and learn an elaborate content management system?

Embrace the new

Luckily, the web is changing. New tools are being created that eliminate the trade-off between capability and ease of use. In other words, you don’t need to be a certified geek to pull off a great online portfolio. One service to consider is 4ormat, which gives you a slick portfolio instantly, and lets you customize the look and feel with just a few clicks. It’s also optimized to look great on mobile devices like cell phones or tablets, so you can show off your work wherever you go. 4ormat even lets you connect your portfolio to your own domain, if you happen to have one.

Manage your résumé

Especially if you’re looking for long-term work or contracts with larger agencies. First, make sure it’s accurate, readable and convincing. Liberate it from typos and punctuation errors. Then, make sure people can find it quickly. To do that, make sure it’s available on your site in “plain text” format so that it’s easily indexed by search engines. Job search sites like Monster and CareerBuilder post your résumé this way, as does the aforementioned portfolio site 4ormat. This can also be done with WordPress, but it’s a bit trickier. You should also convert your résumé to PDF, an almost universally accepted document format. PC users can do this for free using software like CutePDF Writer and on a Mac you can simply use the Print to PDF feature.

Use social networking to your advantage

If you don’t have one already, put up a Facebook page with examples of your work. But you should also consider building a profile on other popular sites. LinkedIn caters to a more business-minded audience, so it’s key to developing your professional reputation. Twitter lets you post frequent, short updates for people to follow, letting you connect with potential buyers, collaborators and mentors. You can also “follow” the posts of other people, keeping you updated on the latest insights, trends and opportunities in your field. Whichever sites you use, make sure to include some form of contact info, and always link back to your online portfolio.

Help people find you

Submit your portfolio site to search engines like Google, Yahoo and Bing. Search engine optimization, or SEO, will help your site show up in searches. Many free guides exist, but there are a couple of obvious techniques. Use metatags and keywords that relate to the subject — yourself — and to your work on every page you create, so people can find it easily. Link to your portfolio wherever appropriate and try to get others to link to it, too.

Manage your rep

Now that you have an online presence, it’s important to maintain a consistent and professional identity. You also need to stay active — in the social world, the key is to “just show up.” Do one thing daily to promote yourself and your work, but don’t spam. Forge beneficial relationships by communicating with people in a style reflective of your personality and values. And remember: what you put online can stay there forever, for anyone to see. Your reputation is as valuable as your work, so make sure both are at their best.

Finally, motivate yourself. The web has some amazingly powerful tools, but the rest is up to you!

Are you worried about 642-427 prep and 642-873? Check out our latest resources for 642-637 dumps and 352-001 questions for practice with definite guarantee of 642-359.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

Making it as a Creative Freelancer: Online Portfolio Tools You Need to Use

It’s all very well creating beautiful, intricate illustrated letterforms, but how do you convert them into a usable display font without sacrificing detail or quality? HypeForType explains how they converted Alex Trochut’s illustrated alphabet into Neo Deco, an D&AD award winning quality display font. Alex Haigh provides us with a key insight into this process in the following tutorial. (Want to follow this tutorial for yourself? Download the sample Neo Deco glyph to work with. (Strictly for Non Commercial purposes only)

Step 1: Finish Designing Your Alphabet

So you’ve already designed your alphabet. The first stage in turning it into a font is to check through all the characters for consistency, eliminating potential problems like stray points and overlapping elements. It’s usually faster to fix these issues in Illustrator before attempting an import into FontLab.

Step 2: Considering Extended Characters

It’s worth considering creating an extended character case when putting your typeface together. This will open your design up to a much larger market, giving people the option to use it across any number of languages.

Step  3: Create A New FontLab Project

Once all your characters are ready, open FontLab, and go to File>New. Save the file (Ctrl/Cmnd+S). Next, go to File>Font Info, and enter as much as you can into the font’s metadata. Pressing the diamond icon at the bottom of each window will automatically fill in some fields for you. For more detailed instructions, feel free to contact us. Remember that although the initial field in the Metrics and Dimensions tab doesn’t normally need changing, when dealing with detailed typefaces such as Neo Deco you should choose a higher UPM size.

Step 4: Size First

Before importing your characters into FontLab, first ensure they are big enough to be worked on – Alex’s had to be enlarged because they were less than 2.5 inches tall. As long as your sizing is kept within a range of 101-150%, FontLab will suffice, but it’s best to do your primary resizing within the program you used to create your lettering. If you used Illustrator, double-click the Enlarging icon, choose Uniform, and enter the Scale in the field (I use ‘US Letter’ as my optimum import size for the average 1000UPM font, but I tripled the target size for Neo Deco, enlarging each letter by 1500%). Click OK. Now press Ctrl/Cmnd+C and make a copy.

Step 5: Your First Glyph

You can now move your letter into a glyph cell in FontLab. Double-click the cell, and press Ctrl/Cmnd+V to paste the copied letter. To adjust the placement, click and drag it into position at the lower left. If you need to resize your letter further, go to Window>Panels>Transformation. Click on the enlarging icon on the panel, then check the Uniform box and choose Bottom Left Corner from the drop-down Center menu. Enter the percentage (I enlarged Neo Deco by another 122% here), and hit Return.

Step 6:  Making Use Of Decender Space

If you’re making an all-caps face such as this one, making use of the descender space will allow you to retain the largest possible glyph. I set a target cap height of 1930 (1970 for round characters, 40 units below the baseline and above the cap height). As shown, the baseline was actually at -215.

Step 7: Better The Outline, Stronger The Font

The more perfect the outline, the better the font. To ensure that you’re achieving optimal results, make sure you regularly use FontLab’s Audit features. These audits can be turned on selectively through the Preferences Panel.

Step 8: Non Vertical Lines

If you’re concentrating on a letter that consists of many non-vertical lines, it will help to turn off the Semivertical line audit. I had many extremum and connection flags that required tending at this stage, but my primary concern was the ‘Line segment too short’ flag – a result of fixing these in the 1000UPM size. In this situation, select the audit and check to make sure that no flags show on the glyphs. By utilising the maximum number of units possible, you will eliminate this flag.

Step 9: Save Time With Auto Hinting

Once you’ve eliminated all the flags, employ the remaining standard font production techniques to the spacing and kerning of the font. Go to Window>New Metrics Window. I strongly suggest using Autohinting on fonts of this complexity – it’s a default setting in the Font Info panel. First, adjust your side bearings. Double-click a glyph, and drag the side bearings to achieve the desired spacing in the Metrics window. Now open the quick select drop-down menu, use the alphabet sections to fill the field, then make sure you type it out to check the spacing before moving onto the next glyph. Once you’ve completed all the glyphs, you can begin kerning. Click on the letter to the right of the space you want to adjust, and drag the bar to move the letter. Check all letter combinations – upper- and lowercase – and basic punctuation as well.

Step 10: Generating Your Finished Font

Once you’ve finished spacing and kerning your font, it’s time to generate a working typeface. The most common format is TrueType or OTF. Open the Extended Steps document on your cover disc for detailed instructions on how to do this. You will receive an error message upon generation of an OTF version. This is a warning you will need to overlook – it actually refers to the fact that you’re using an unconventional UPM that may cause display issues on screen. This is unavoidable, so choose Ignore. Most programs don’t make display concessions for non-1000UPM sizes. The result often shows a character that appears to be cut off. The easiest way to fix this issue is to place a carriage return at the top of the text box so the entire character can be seen. You now have a beautiful display font, with all the detail of the original face.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

HOW TO: Create An Intricate Display Font – HypeForType Tutorial

The encyclopedia at interaction-design.org has just launched and includes video interviews, commentaries, interactive illustrations, and lots more. The encyclopedia deals with Interactive Design, Usability, and User Experience and the heading of the project is “Democratization of Knowledge”: That people from all the far corners of the world can get free access to world-class educational materials.

The encyclopedia has taken the opposite approach of the Wikipedia and crowdsourcing: All chapters are written by leading figures who either invented or contributed significantly to the topic they write about. However, it’s similar to the Wikipedia in that readers can copy and use the content for any purpose.

Living in the US, China or Germany doesn’t make a difference. Everybody can access all of the content. For free and forever. Students and practitioners usually spend up to $200 on each high quality educational textbook dealing with the design of interactive products like the Apple iPad or Microsoft Windows. That may be acceptable for someone in the US or Europe, but not for someone in India, China, or Indonesia. That’s the reason why researchers and professors from prominent companies and universities like Cambridge, Stanford, Microsoft, and IBM now contribute hard work for free to create open access to their knowledge.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

New Encyclopedia on Interactive Design, Usability and User Experience

Email Direct Marketing Campaigns (EDMs) are becoming an increasingly popular method of communication and, assuming you are not a business selling male enhancement products, they can be very effective. But before you start coding an HTML email, there a few things you should be aware of.

1. Scrap Divs, Tables are back.

You have probably spent your web design years hearing of the evils of table layouts, and have been (rightly so) using divs to achieve layouts in your web page. But in HTML email you will need to use tables and sometimes tables within tables to achieve the desired design.

2. Limited CSS support

Unfortunately a lot of CSS is not widely supported by the popular email clients, for a list of which browsers do and don’t support what click here.

3. Inline CSS

As well as the limited CSS support the other CSS annoyance you will come across in HTML email is that you will have to define CSS the hard way. For every ‘p tag’, for example, you will have to define your font size, colour and line height and so on.

4. There is a white gap between my images

You should add style=”display:block” in the image tag for those images you want to display border to border.

5. There is still a white gap between my images

Define the width and height of both your images and your cells. Where the cell height may vary, such as cells containing text, height=”auto”

6. Keep Thin

Think about how people will be viewing your email. Once you account for the pixels used by email clients and their menus and ads you don’t actually have a lot of width left to use in your design, especially for users with a small size screen. As a rule keep you the width of your layout around 600px.

7. Don’t only use images

With all of these coding complications and design considerations it may be tempting to make the whole email an image. But actual text should be used where possible as it will be much quicker to load. It is also important to use actual text because many email clients block images by default and a purely image based email will just render as grey boxes.

8. View it in browser link

When you are done with your design, upload it and then add a link to the top of your email, that way you can ensure that your design can be viewed the way you intended.

9. Subscribe and opt out

Continual unwanted emails will give your company a bad name and could very quickly become an legal issue. To start off with make sure the list you are emailing have opted into receive such communications. You should also always provide a means to unsubscribe/opt out at the bottom of the email.

10. Track your campaign

EDMs are only a cost-efficient means of communication if they are effective, and you can only start to know if they are effective if you track and analyze their results.

Tracking email open rates and click-throughs maybe a feature of the email marketing software you use. But if they are not, bit.ly and google analytics are free and provide statistics about click rates on specific links.

header image by bubblefriends

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

10 Valuable Tips and Tricks for Designing HTML Emails

This is a guest post from Maurice Kindermann, a web developer and designer from Kintek.com.au.

I think we can all agree Amazon.com is a pretty uninspiring website, no revelation there. They were once known for pioneering much of what is now referred to as ‘standards’ in ecommerce. These days, the online giant is looking a little worse for wear. Personally, I’ve been avoiding the website for years because of how unappealing I find it, so when I recently went to buy a Kindle I was not surprised to learn of some major fragmentation and usability problems.

View original Kindle page   |   Original Post

Brief History

Let me back up a bit, back in the 90′s US websites were notorious for providing very limited or no shipping options to international customers. Even today, American websites that do offer international shipping generally have bloated or unreasonable pricing. Take one look at eBay and you’ll see what I mean. I’m a massive eBay user, and if you live outside of America you may have noticed other countries (especially the UK) are offering very cheap or even free shipping. Given America’s current economic climate, I think it’s extremely important that large corporations like Amazon don’t shaft their international buyers by treating them like second class citizens. If they keep doing an average job, someone will come along with an above average solution and Amazon will be the next Yahoo… There, I said it!

Before I started scrutinizing the Amazon website, I did some research and found a couple of interesting articles. Econsultancy wrote Amazon relying on brand creditibilty instead of good usability. It compares some key usability aspects between Amazon.co.uk and The Book Repository UK. SlashDot also recently reported that Amazon has Tonnes of Fake Reviews.

Amazon’s current design

I own two 22″ monitors that sit side by side. Although I’m not the norm, this makes reading any content on Amazon (or any fluid website, WordPress admin panel included!) a painful experience. Widescreen cinema was invented for the film industry because our eyes move left to right faster than they do up and down, and this causes less eye strain. With this sort of logic you might think wider websites would be easier to read. Well, books are vertical for a reason, and it’s been shown that the ideal paragraph length is between 40 and 60 characters (depending on where you look).

With that in mind you can see what Amazon.com looks like on my monitor followed by what it would look like with two lines of code to give it a max width.

The Code:

body{ max-width:1200px; margin:auto;}

Before:

After:

Fragmentation

Nothing is worse. The only discernible difference between the Australian (international) and US version of the Kindle product page is the shipping options and the URL. Technically speaking, there’s no reason why these pages couldn’t be combined to give customers a streamlined buying experience. This was one of the main inspirations behind my redesign and what I tried to illustrate. You’ll see below the steps involved in adding a product to your cart. Personally I think this is unacceptable.

Content is king, right?

Content certainly is king, but it’s important to restrict the amount of content per page. I did a quick test by copying and pasting the entire Kindle product page into Microsoft Word, and you might fall off your chair at the results. 62 pages, 11,832 words. Obviously Amazon want to make sure you know exactly what you’re buying, but it needs a bit more management. This is what I’ve demonstrated in my design with the “Reviews” section. I’ve turned two massive sections on the page into a humble slideshow. Here is the before and after:

Ending thoughts

The current Amazon design was implemented back in September of 2007. A lot has happened in the design industry since then, and it’s about time Amazon picked up its game. I’d love to hear what other people think of the Amazon website, especially regular and international buyers.

If you’re interested in reading the full article which details the process and terrible international usability I documented when buying the Kindle, it can be found here.

Copyright © 2010 Maurice Kindermann

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

Redesigning Amazon

In September of 2007, I chose to engage in a four year art program at the University at Buffalo’s Department of Visual Studies. My hope was that my interest in graphic design would lead me on a path far from the arid and repetitive routine of large text books and long lectures that had plagued my freshman year of college. In May of 2010 I graduated from this program with a B.F.A. in Communication Design, a solid network of professional contacts, and a portfolio constructed well enough to immediately land me my first job in the design industry. After repeatedly being told how hard it was going to be to obtain a job as a designer in such a competitive field, I couldn’t help but conclude that it was clearly luck which got me to that first day of working as a professional.

I’ve now been working for six months and I can already safely say I am better off because of my education than I would have been without it. But not for the reasons you may think. I was not taught how to master Photoshop or Illustrator. I was not taught how to compose a piece of work a specific way in order for it to be most effective. I was not taught how to communicate with a client or even meet anyone’s needs other than those of my own. In fact, I hadn’t even designed a website before this past summer. I reassessed my previous assumption and found that I actually started off on the right foot because of one thing: Self-confidence. It’s this single, consistent factor that has led me to a great beginning in my professional career, and I have my professors to thank for igniting it.

Throughout my three years of study, I found the lack of self-confidence in design students to be shocking so I made it a point to always find the positive in everything I worked on. But just like everything else related to art and design, I believe self-confidence is best self-taught. With that said, I decided to begin to assess how I went about gaining self-confidence.

Write Everything Down

Benjamin Van Dyke was the very first professor who made a profound impact on my mindset as a designer. One of the many things he stressed was writing. He forced us to begin writing everything down. All our thoughts, concepts, observations, rants, and sketches were to be recorded and archived in whatever written form we desired. I found writing to be an organized method of legitimizing the insanity that constantly floated throughout my head. I’m not saying I’m insane, but I would generally have hundreds of ideas which I wanted to put into visual form that I just couldn’t keep track of.

Writing was the answer. It allows you to make sense of what you’re subconsciously absorbing during your day. Even more important, it allows you to revisit your thoughts and apply them when needed, specifically when trying to make sense of something that you previously didn’t understand. I feel writing will only help you grow as a designer. It’s the first step in training yourself to make predictions, statements, conclusions, and connections pertaining to your thoughts, the ideas that are unique to you. Once you have a greater understanding of your ideas, you’ll begin to enforce them, and naturally become confident in them.

Take More Than You Can Give

In my experience, design students tend to steer clear of criticism when they can. I feel as young designers we do this not because we lack the ability to create great work but because we lack self-confidence. As you build your ideas and gain more knowledge, do not hesitate to apply your intelligence by giving respectful criticism to your peers. Try your hardest to give constructive criticism. This will not only help your peers with their creative processes but it will make them recognize the fact that you have something to say and you’re not afraid to say it. It will undoubtedly lead to their appreciation for you, so long as your criticism is indeed constructive, and result in a natural boost in your self-confidence. However, always be willing to take more criticism than you give. Listen to what others have to say, no matter how appropriate you may think their comments are.

We as designers seek reactions to the messages we create. Taking criticism will help you refine your creative process so that you can better achieve the results desired in future projects. It will also allow you to build ‘thick skin’ which can come in handy as you will always receive negativity from someone regarding your work. As you become more comfortable with criticism, you will become more comfortable experimenting with design and explaining your results. This is a necessary step in building your self-confidence, and a huge attribute to have when searching for a job or dealing with clients.

Have a Reason…For Everything

While in college, I found that too many design students anchored themselves on the idea that if they created something that looked awesome, it would automatically be deemed successful. I learned not to simply create things that look good. I found that in order for my work to be successful I needed to have a reason behind every decision I made. Once you create something with reason AND it’s beautiful, then you’re chances of success are greatest.

You must keep in mind that people tend to interact with things that are aesthetically pleasing. However, more often than not, pieces of work that are aesthetically pleasing are only so because the piece of work has already served its purpose in such a naturalized way that we didn’t even notice it working its magic. (This notion is extremely important in UX design.) Having reasons for your decisions will inevitably lead to you creating better work and a better portfolio. A better portfolio equals higher self-confidence.

Sacrifice

There are two things design students fail to realize, and they’ll probably be hard for some of you to stomach. One is that you actually have more free time now than you will in a few years. Secondly, letter grades and grade point averages really don’t mean anything in the design industry.

It’s important to sacrifice certain aspects of college life when necessary in order to attain short term goals relating to your creative process. Take the necessary time needed to meet the requirements for your assigned projects. But make sure you take the extra time you have to find ways to push those projects in directions no one else will. Step outside the area of what is expected and sacrifice a weekend or two to finding a way to make a project unexpected, surprising, or simply ridiculous. Once you’ve done this, you will feel better about your work, knowing you pushed yourself to a boundary you previously were unfamiliar with.

Next, don’t worry about the grade you receive on a project. If you’re passionate about design, and you put your heart into proving something through your work, it will be noticed as a success by some regardless of the grade received. Letter grades are simply scare tactics made to limit you to the standards set by that particular institution’s education system. They’re in effect to make sure you abide by rules. Breaking the rules makes way for innovation. Creating something unique requires the actualization of something never done before. I’m certainly not recommending you completely disregard your grade point average, but what I believe is that it’s easy for everyone to fulfill a project’s requirements by incorporating what is deemed necessary by a letter grade and nothing more. I encourage you to go beyond what is necessary and what is expected of you. Do this and I can assure you it will end with a satisfying letter grade and, more importantly, a heightened sense of self-confidence.

Always Have Goals

If you don’t have a vision of where you want to be in five years, get one. Every designer has a dream of being the best at what he or she does. But to achieve that dream you have to first set goals.

Start now while you’re young. Tell yourself that you’re going to create a beautiful portfolio by the end of the semester. When the end of the semester rolls around, tell yourself that you’re going to have a job by the end of the summer doing what you love to do. When you have that job, tell yourself that you’re going to master typography, etc. All of this may sound strange, as if you’re faking yourself into believing everything is going to be alright. The advantage to making you actually believe in yourself is that you loosen up mentally. Just like an athlete, it’s important for a designer to stay loose. This means banishing worry from your mind so that you can focus on what your imagination is telling you. Believing in yourself will allow you to manage the stress that comes with being a designer. Believing in yourself is important, it’s essentially the most prominent factor in acquiring self-confidence.

Self-Confidence Can Lead To Success

If you’re able to build self-confidence as a design student, you’ll be one step closer to being able to comfortably master whatever it is you desire in life. Confidence leads to better artwork and in turn will lead you to a better portfolio. One thing they do teach you in school is that a better portfolio will certainly give you an increased chance at making a mark in the creative community. And that’s something no designer will argue.

This is a post from Inspired Magazine. If you like it, you may want to subscribe to our RSS full feed to be updated on every article we're publishing. Also, it's highly recommended to follow us on Twitter!

Design Students: Build Your Confidence Before Your Portfolio