Articles by ‘Jake Rocheleau’

Communicating UX Goals Through Interface Design

Modern websites are expected to be much more interactive than previous decades. Website design isn’t just about content anymore. It’s about clean user interactivity for reading and browsing through content. Web designers have to consider the behavior of visitors and how design can affect that behavior.

This post catalogs a few clarification methods which can be employed during the interface design process. It’s wise to formulate a plan before even starting a design mockup. This way you’ll have a finely-tuned direction for the website and its interactive elements. Once you understand more about design clarification you’ll have an easier time focusing on the bigger picture of user experience…

Read More »

Merging Responsive Web Design Ideas for Desktop & Mobile

Web designers have taken on many more roles in just the past few years. It’s now quite common to find designers who also specialize in frontend development, UX design, and even some backend development. One of the newest trends of responsive design is crafting a single base of HTML/CSS code which can fit properly into any browser window.

There is an intricate balance between desktop and mobile web browsers. Now more than ever it’s crucial that web designers find a balance for all users in every major website. Responsive web design is more than just supporting mobile devices – It’s truly about creating flexible layouts with page elements that can shift and rearrange themselves according to the current viewport.

In this post I’ll explore some responsive web design ideas to help get your creative juices flowing and hopefully leave you feeling ready to make some changes to your sites if needed…

Read More »

12 Excellent Font Identifier Tools To Speed Up Your WorkFlow

Designers have a need for relevant fonts in all creative mediums. Both print and digital design follow a similar track when choosing and composing typography. But there’s always the nuance of actually choosing which font to use. While on the search for a terrific typeface it’s all-too-common to bump into a great font that’s also hard to identify.

Thankfully in our modern high-tech era there are plenty of font identifier tools which can help. All of these tools can be accessed using a web browser and they’re a lot more accurate than you might assume.

The following resources are meant for designers and developers who often need to identify a particular font. Up until recently this was an arduous task which required hours of research and letter matching. But nowadays you can find the exact font family(or at least related choices) in just a matter of minutes…

Read More »

Top 25 OS X Sketch Plugins for Designers

Bohemian Coding is a software company most notably recognized for creating the OS X application Sketch. It allows designers to work with both vector and raster images in the same document. As you might imagine, this program has caught widespread attention from web & graphic designers all over the world. And if you design on a Mac then it’s worth testing out Sketch just to see what all the fuss is about.

For this post I’ve collected 25 free & useful Sketch plugins meant for all types of design. Whether you create icons, interfaces, or anything else, these plugins will surely improve your workflow.

Mastering Sketch takes time and lots of practice. Since the program is still new there isn’t as much information online compared to other programs like Photoshop. But sticking with a routine of continual practice will yield amazing results – and these plugins can prove to be quite beneficial along the way…

Read More »

Ultimate Guide to Designing Brand Guidelines

Whether sculpting a new identity or working with an existing one, brand guidelines can be exceedingly important to the whole creative process. A branding guide (also known as a style guide or brand book) offers a set of rules about a company’s brand to anyone who may need them. To whom might these rules be directed?

Basically anyone who may need a company’s branding added into their own work. Authors, editors, copywriters, marketers, web designers and/or graphics designers are just a few examples. The purpose of a branding guide is to offer a step-by-step process for duplicating the company’s identity.

Although it may seem like a rudimentary process, brand guidelines need to be super clear and relatively specific. Each company will make up their own rules based on how their identity should be used out in the wild. Since this type of project can easily lapse into a state of disarray I’ve put together this handy guide for designers. You’ll find a metric ton of great examples along with practical tips which can be applied into your own branding guide…

Read More »

30 Best Free Calendar & Datepicker jQuery Plugins

Some might assume that an Internet loaded with free code would breed indolence. Yet it seems developers are willing to contribute their help to projects more than ever before. JavaScript libraries are a microcosm of the larger open source community – specifically jQuery with its ever-growing popularity and easy learning curve.

One such area of broadened potential would be jQuery-based calendars for websites. Although date & calendar interfaces have sparse usage, they come in handy for very specific circumstances. And when building a site that requires this type of interface you’ll be happy to know there are dozens of open source plugins available.

I’ve catalogued the 30 best free jQuery plugins that offer datetime functionality. Some are more developed than others and each plugin has its own set of benefits. The best part about using open source code is that it’s easy to customize for your own purpose. So peruse through this collection and take a look at any plugins which pique your curiosity…

Read More »

Ultimate Guide to HTTP Status Codes and Server Error Messages

Most of us are familiar with the gut-wrenching, nerve-wracking error codes like 404 and 500. But did you know that not all HTTP status codes and server error messages are mean and scary? Although some of these numbers could appear in the tech remake of Nightmare on Elm Street, others should evoke a sense of excitement and jubilation! But these “good” status codes are rarely visible to the average Internet user.

So this leads us to one final question: How do all these status codes work?

In this guide you’ll find all the necessary information to understand the concepts behind HTTP status code messages. Whether you’re a designer, developer, or just a curious Internet fanatic, this information should be useful to people of all backgrounds. It is my goal to clarify the process of website requests and how the web server passes information to your machine…

Read More »

Ultimate Guide to Color Theory for Designers

If a picture is worth 1000 words, then how much can we say about an interface? Well it turns out quite a lot, and there’s often many different topics worthy of discussion. One such topic is color theory which comprises the basic techniques of picking a matching color series.

This guide explores the subject of color relative to web and graphic design. The information is meant to be introductory while also getting into more applicable topics for digital designers. Advanced color theory is something best learned through practice rather than theory, but in order to improve, you have to start somewhere. Along with helpful tips and ideas for designing with color, you’ll also find plenty of valuable resources interspersed throughout the article…

Read More »

Ultimate Guide to Responsive Web Design

When I think of responsive web design I think of Transformers: Websites in Disguise. With one set of code you can build a website layout that runs flexibly from desktop to mobile. But instead of fighting off Decepticons we’re fighting an even worse antagonist known as bad design.

Responsive web design is still a fairly new concept which has grown in popularity because it fills a void. Back when CRTs were crushing our desks and cryptic dial-up tones connected us to cyberspace it was a pleasure just to access the Internet. Design was important but didn’t have a prodigious overzealous support group…

Read More »

The Ultimate Guide to Parallax Scrolling: Best Practices, Examples and Tutorials

The idea of parallax design is simply an awareness of movement. More specifically, the word ‘parallax’ is used to describe the perception of distance between objects while moving along a line of sight. For example the objects nearest to you in space will seem to move quicker and more dynamically than “background” objects. So parallax is just a measurement of the difference in position between 2 points from the viewer’s perspective. Since the objects aren’t really moving it’s just a type of illusion like 2D animation.

One of the simplest ways to understand design is through example. Let’s take a glimpse into specific trends used to create parallax design features in website layouts.

Read More »
Page 1 of 3123