HOME / Design
Free eBook for web designers
// Smashing Magazine is promoting it’s Smashing Library service and they are offering a free eBook with a collection of some of their best articles. Contents include: - Designing For The Reading Experience - Logical Breakpoints For Your Responsive Design - Sketching A New Mobile Web - Towards A Retina Web - Avoiding The Pitfalls Of [Continue reading]
Jazz up your web page with Spritely
// Apparently, programming, like life, is sometimes going in circles. Almost 30 years ago I was doing my first steps in programming, coding sprites on my MSX2 in some lame attempts at game development :) Today, I’m revisiting the technique for a whole different purpose. Below you can see an elegant approach to a hover [Continue reading]
Blog Redesign, Part II
// I’ve been refining the redesign of this blog (see previous post about it for a screenshot of how it looked in the past) and here is the summary of recent changes: All pages: Full page width! Home page: - More space between boxes - Very very white background on boxes instead of gray - [Continue reading]
Look, I have a notification about… something
// The badge icon says I have a notification in the #Google+ app. So I open it, and click app’s notifications counter. And I see this. Some (specified) people did something but it doesn’t tell me what. Some other people whose names are mentioned did something else (or perhaps the same action) in probably another [Continue reading]
Now this IS parallax!
// I’m not a big fan of parallax scrolling sites. Mainly because it is CPU-intensive which means that you will have people with a bad experience and by definition you are constrained to a small number of "pages" which means that you can only use it for small sites and you can’t upgrade such a [Continue reading]
Blog redesigned – comments?
// I hadn’t touched my blog’s design for a bit over year, so I thought it was time for a refresh. Yes, In case you haven’t noticed, I have a blog at which contains a full (an indexed) archive of all my Google+ posts. So over the last 20 months I have ended up writing [Continue reading]
Finally, an awesome UX tutorial
// Answering the question "What are the best resources for learning bleeding-edge web, UI and UX design?" on Quora, Colm Tuite, UI/Visual Designer & Developer, decided to write one of this own. The result was an extensive post / #tutorial with 10 steps to a decent (if not great) start in learning about #UX. To sum [Continue reading]
Colours, Emotions, Brands
// This kind of chart has been going around the net for a while, but a reminder is always good :) If you’re looking for more #marketing -oriented #color #infographics see also How do colors affect purchases?http://bit.ly/VG6O70 (Chart by The Logo Company http://bit.ly/VG6wwT)
The interface is (part of) your brand
// When it’s pointed out it is kind of obvious but you might not consider it otherwise. Interface elements are indeed part of your brand. If you’re not convinced take this quiz: can you recognise the origin of the buttons on the image below? Answers on the original article by +Marc Hemeon : http://bit.ly/11cxFK9 Marc has [Continue reading]
15 Years of Apple.com
// A collection of #Apple ’s home page layouts since 1997!http://www.slideshare.net/choehn/15-years-of-applecom-15990876
Reminder: People come to your site to consume content
// They do not come to see ads or others links to other pages to your site, or navigation links or social media buttons. So it is a bit counter-productive if the first 800 (probably more) pixels of your page do not have a single line of text from your content. The example below is [Continue reading]
Icons in a Font: Elusive & Font Awesome
// Elusive and Font Awesome are two open-source #fonts containing over 200 icons each. They are geared to be used with Twitter Bootstrap but you can use them in any kind of project. Check them out!Elusive: http://bit.ly/VCtQ9BFont Awesome: http://bit.ly/WatPZ5If you need more #free choices, here some more in font and PNG formats: http://bit.ly/UKIqxA
A Laconic History of the World
// Simplifying history is of course… simplistic, but still here’s a #fun #typographic #map designed by Martin Elmer of maphugger.com This map was produced by running all the various countries’ “History of …” Wikipedia article through a word cloud, then writing out the most common word to fit into the country’s boundary. The [Continue reading]
The Subtle Art of Documentation Advertising
The screenshot below is from a case study article of Microsoft’s MSDN developer site. In a great example of how to advertise #Metro over iOS without shouting "Metro kicks ass!", the article describes all the steps the authors/developers took to convert an iPad app to Metro. At the same time, every single part of the [Continue reading]
Download: Windows Metro Icon Collection
Here is http://bit.ly/PI0JkX a collection of 690 #icons in the visual style of #Windows 8 (also known as #Metro ). The collection comes with - Separate PNG files 26×26 pixels for each icon, ready to use- Single EPS source file so you can scale the icons in any vector image editorMany thanks to the kind people of [Continue reading]
It's not you, it's the user
Software as social hacking Finding out how you site/app/whatever is being used and percieved by the users is as important (or more) as your original specifications for it. This is what Grupper (a social service that sets up up drinks between 3 men and 3 women) discovered when they realized that cancellation rate for their [Continue reading]
Responsive design strategies
Through fluid grids and media query adjustments, responsive design enables Web page layouts to adapt to a variety of screen sizes. As more designers embrace this technique, we’re not only seeing a lot of innovation but the emergence of clear patterns as well. I cataloged what seem to be the most popular of these patterns [Continue reading]
Glyphs, Icons, Pictograms, Free!
I’ve been a long time user of the famfamfam.com icon library but recently I’ve been looking for something fresh. Here are some very nice choices for your icon greed :) Entypo by +Daniel Bruce Over 100 icons in EPS or as OpenType font. Free with attribution (you can donate, 50% goes to wikipedia)http://bit.ly/wEuNiE +GLYPHICONS by [Continue reading]
It's an upside down world
I know you like maps on signs so I put a QR code on your sign to open up a map… Someone please explain the rationale for placing a huge QR code on a sign on the space where you would normally put a map, and then having the QR code be a link to [Continue reading]
Responsive design wireframing
The #responsivedesign concept is quickly becoming a must-have item in any new web design project. But while the miracle of "code once, run everywhere" is upon us, some challenges are ahead for the designer. Suddenly, it’s not one #wireframe , but three or four (for each #layout of the website). And while there may be [Continue reading]
Can you convince me in 5 seconds?
Value proposition is the #1 thing that determines whether people will bother reading more about your product or hit the back button. It’s also the main thing you need to test – if you get it right, it will be a huge boost. If I could give you only one piece of conversion advice , [Continue reading]
How to Design User Flow
Getting visitors to your site is one thing. But once they are there, you need to provide an exciting/useful/engaging/you-name-it experience if you are going to have results. The good folks at conversionXL.com have a very thorough post on how to guide your visitors to the desired action (whatever that may be: sale, quote form, support [Continue reading]
Testing your responsive design
So you’re following the latest trends in #web development and have decided to develop your new site with a #responsive design. You quickly realize that’s kind of hard testing the site on multiple resolutions every time you make a change. +matt kersley has a nice solution: http://bit.ly/ycYno9 A simple setup with iframes will show the [Continue reading]
Amazing Cisco
What kind of mind decides that a "contact support" form should have a 128-characters limit? That said, when there is an issue with an account and it gets disabled, what kind of mind decides "let’s not send an e-mail to the customer about it, he’ll figure it out next time he tries to use our [Continue reading]
Building a website in 2012?
If you are planning on developing a new website, here as some concepts (some old, some new) on how to go at it: - Think responsively – Even if you’re not implementing a full responsive design, simply thinking in responsive terms goes a long way to achieving usable universal design.- Think touch-first – A button [Continue reading]
Advancing the HTML experience
www.mycookingdiary.com by +Mike Matas is great example of what you can do (and how to do it properly) with #HTML and #CSS today: - A continuous user experience using AJAX to keep the user engaged. However, each "slide" has it’s own URL. This means you can bookmark it, share it, etc.- Animation – but on [Continue reading]
Creating an effective company/product presentation
An excellent post by +Guy Kawasaki on presenting your company and product. Extremely long but really analytical! Read on… Reshared post from +Guy Kawasaki (Mon01) Welcome to the first in a series of posts I’ll be doing as part of a partnership with Microsoft and Office Web Apps. Over the next two weeks, I’ll cover [Continue reading]
Searching for a font, Part II
After my first attempt, I thought it was time for a small visual update on the site. The previous choice: Ubuntu The alternative: Adelle Bold by TypeTogether (you can get the font via Font Squirrel) Current choice: Franchise Bold by Derek Weathersbee (free download, donations accepted) The last choice also lead to some minor layout [Continue reading]
LEGO 404 page
Very nice #404 image by LEGO :)(via +Sebastian Schmidt) I think I’ll start a collection! What’s your favorite 404 page? Reshared post from +Daniel Waisberg Greatest 404 page I have ever seen! Had to be from LEGO…