Design and Development

Posts Tagged: design

Redesigning the Miva Merchant E-Commerce Application


Filed under: Case Studies, Design Inspiration, Web Development.

After working with the Miva Merchant E-Commerce app for the past few months, I have been getting more and more frustrated with the overall design and layout of the app. Miva is filled with bold purple, dirty yellow, table-based layouts, non-reponsiveness and hard to read small fonts.

I took it upon myself to reimagine the interface in a more modern, user-friendly way while still keeping to a similar Miva branding. I also tried to stay as close as possible to their overall organization principles so as to not make this project too massive.

I find myself saying: “Why can’t it just be like Shopify or Squarespace?”.

Squarespace Admin Shopify Admin

Maybe I will just switch over to one of those platforms soon, but for now I am bound to Miva.

Read more…

Flat Design: Some Good, Some Bad…


Filed under: Design Inspiration, Web Development.

First off, I need to say that I am a proponent of flat/minimal design when done correctly. Websites that are loaded with 3d skueomorphics remind me of something from the by-gone severely bloated flash era.

Glossy Skeuomorphic Button

Glossy Button:

When creating things with a flat design aesthetic, we need to always remember to focus on our users – not on a popular design trend. So if that gradient or dropdown-shadow doesn’t help the usability factor, get rid of it… but don’t get rid of a subtle gradient or some animation just for the sake of flatness…

Flat design reminds me of the fashion industry a little. Every year a new fad comes out that everyone must wear to look cool and be popular. If you don’t wear what’s trendy – you are outta it man!

Read more…

What is so amazing about Icon Fonts and SVG’s?


Filed under: Responsive Design, Web Development.

The year is 2010, the web world is peacefully floating along…  suddenly everything is shattered as Apple announces the world’s first high-resolution Retina screen.

Designers everywhere are reeling with this news trying to figure out a solution to this problem. Suddenly one designer has an idea – we can create two sizes of all our images and serve them up based on your screen resolution!

The only problem is that not only is maintaining two versions of every image a hassle, but it hasn’t really solved the problem.

The problem is not Retina screens, the real problem is static non-scalable images. It is only a matter of time until Apple or Samsung releases a 4x retina display that will force designers to begin creating 4 versions of every image asset.

Icon Fonts vs SVG’s

What we need are truly scalable vector graphics – enter Icon Fonts and SVG’s. Both of these formats give us a huge step in the right direction of completely resolution independent graphics.

No more creating multiple sizes of your jpg/png images, and serving them up with media queries and javascript – hooray!

Read more…

How to standout in a world of mediocrity


Filed under: Design Inspiration.

Last week I went to an Entrepreneurship conference where I heard an amazing talk on excellence by Mr. Gary Powers. Powers is the Owner of Ortho Molecular Products, a company who aims to change the way the health supplement businesses are run.

Excellence: How to standout in a world of mediocrity

Powers says many company’s products are not accurately represented on their labels. A supplement label may say it has Betaine to aid with digestion, but how much does it actually have? Many companies will add just a few drops of an ingredient to a huge mixing container and add it to their label to help it sell.

Power’s company is looking to set a new standard of excellence in the industry. His talk led me to think about how these same principles of excellence can be applied to the web industry. If you are tired of the status quo – business as usual – then keep reading!

Read more…

Flat Design: Trend or Revolution?


Filed under: Design Inspiration, Web Development.

Over the last several months, I’ve been reading post after post about “Flat Design”. It seems like every designer is adopting the trend of so-called “Flat Design” and applying it to their work. Even larger companies like Microsoft and Google have followed this “trend”.

Flat Design: Trend or Revolution?

So is “Flat Design” here to stay, or is it simply a passing trend that will be eclipsed by the next great thing to come up next year?

Read more…

Typecast Reviewed: A Designer’s Thoughts after Using Typecast


Filed under: Typography, Web Development.

A while back I wrote about typography and its importance on the web. Typography and content is really 90% of what the web is; so if you are going to create beautiful, consumable content, you really need to pay attention to your website’s typography.

Traditionally we’ve used static tools like Photoshop or InDesign to design our typography and then we recreate it in code. But this has always been a bit of a hassle when switching from static mockup to code and to an actual browser canvas.

This is all changing with great new tools like Typecast. Typecast is a web app that is built to help us as designers use the browser to design our typography and websites. It gives you access to over 1000 web fonts that you can try out on your live website content in an actual browser.

Typecast – Experiment with Type from Typecast on Vimeo.

After using Typecast for a while, I want to share my thoughts with the community about some of its great features, and where it could be improved.

Read more…

WordPress Reimagined in a More User-Friendly Way


Filed under: Wordpress.

WordPress is the most popular Content Management System to date. But is it really up to the task of managing your website? Over the last several articles we have looked at several main problems of WordPress including WYSIWYG Editors, Not enough control over document structure, and a somewhat confusing admin panel.

Wordpress Reimagined

In this article we are going to look at some ways we can improve WordPress to make it way more user-friendly for content editors and business owners.

So let’s jump right in and look at 6 ways that we can improve the editing experience of this awesome Content Management System known as WordPress.

Read more…

What does an optimal CMS user-experience look like?


Filed under: Web Development, Wordpress.

Last week, we talked about several specific problems with WordPress.  I know I said this week we were going to look at some solutions. But in thinking about the problems mentioned, I realized that it was more important to first go over some key user experience (UX) principles before discussing specific solutions.

So this week we will look at what an optimal CMS user experience should look like. We’ll outline the groundwork needed to create a really good editing experience in WordPress, and any other CMS.

The Future of Content Management - Rachel Andrews

This article is based heavily on Rachel Andrew’s talk on “The Future of Content Management”. Her talk really opened my eyes to how much our current management systems are lacking. You can watch it here in it’s entirety.

Read more…

Rethinking WordPress as a CMS


Filed under: Design Inspiration, Web Development, Wordpress.

According to Forbes, WordPress powers one of every 6 websites on the Internet, nearly 60 million in all, with 100,000 more popping up each day. But have you ever taken time to think about how WordPress manages content? Not only from an editing perspective but also from a design/development perspective.

This article has come about from years of experience with WordPress, talking and working with multiple Clients, and being inspired from other innovative products – like Square. One of the things that really strikes me about Square is that they are so focused on their users. They are focused on completely rethinking how payments are done in order to make them beautiful and easy to use.

Head over to and watch this video, it will give you the background needed to understand this article.

Square - Simple and Breathtaking

Let’s think about the WordPress Admin – is it focused on its users; is it easy to use; is it breathtaking? I think we’ll all agree that it could use some work in these areas.

Read more…

Design is Not Just a Veneer


Filed under: Design Inspiration, Web Development.

The question often comes up in conversations among developers, web designers and business owners of “What is Design?”. When most developers think of design one thing comes to their mind. When an artist/designer thinks of design they often think of a completely different thing. In seeking to define this term we need to ask ourselves some important questions like “Why is it important“, “What does good design look like”, “What does it involve“?

As we seek to discover what design truly encompasses, I hope you will not only enjoy learning some new things, but will also come away with a desire and passion to refine your skills as a designer. I want you to be inspired to study this topic further, through learning from other great designers, reading great books and practice – lots of practice.

Veneer Keyboard by Lazerwood Industries

Photo credit: Lazerwood Industries - Macbook Pro with Veneer keyboard

Read more…