INTERFACE DESIGN

The bread and butter of any Website, the interface design is the defining aspect of the user experience. Good interface is absolutely crucial to the Website's success in terms of selling products and services, user satisfaction and return visits, and overall reflection of the company's quality and reputation.

How It Works

The interface design process begins innocuously enough, usually a fleeting idea of the information flow or the simple negative space aesthetic of stark composition. Whatever the inspiration, pen on paper isn't too far behind. Sketching the design on paper and mocking it up with Photoshop® offers the designer an outlet and the client an idea of the direction. After some back and forth banter, development begins! The working odd hours, endless sessions of staring through code, the unfulfilling promises of drinking soda for nurishment... It can add up to an almost magical tranformation not unlike a butterfly metamorphosis, the endless reams of code and pages showing up on any Internet browser as a fully funtional and beautiful Website. Ahhhhh!!

Steps involved in Interface Design

* The usage of the image of the CNN.com® Website is in parody only and not intended to harm any designer's feelings

Randall Communications offers many services related to interface design including site design, development, modification, updating design and code clean up, QA testing and troubleshooting, UI/UX (User Interface/ User Experience) design and social media design and network integration. Please inquire with us directly about your specific requirements.

Samples of Works

(All sample links will open in a new window new window icon, all sample images will open in a pop-up window)

image image

Nordstrom

During the infamous annual "Anniversary Sale," Randall Communications was hired on to help build emails within the online development group. Nordstrom doubles it's email volume during the nearly month-long sale that rivals other companies' holiday campaigns. From the "early access" customers to the people who may have never even bought something but signed up for the email list, there are numerous campaigns and templates but they all work within a streamlined design that is very quick and easy to build. It is a far different world from the scratch-built emails described in the previous job, utilizing image-mapping to avoid the many restrictions forced on developers by the email service providers.

At peak performance, Randall Comm could complete a build in 15 minutes flat, sometimes quicker depending on the amount of mapping and content involved. This would calculate to a minimum of 32 emails built each full day working non-stop, which was standard during this hectic time. It was a fantastic experience and Randall Communications hopes to work again with the wonderful crew at Nordstrom.

To view the Anniversary Sale "Shoes" sample email live on the Cheetah Mail server, click here.

To view the Men's Shop "GQ" sample email live on the Cheetah Mail server, click here.

image

Wunderman

Working in-house with the legendary Wunderman advertising agency was a fantastic experience. Randall Communications was hired on to the e-mail development team for a contract. Wunderman has some very high-level clientele that demands the most stringent and solid code, detailed testing, and having multiple teams dedicated to perfecting each build to ensure that nothing would ever go wrong on the receiving end of the process. While the process may seem tedious at first, it is greatly challenging and very satisfying to build these massively embedded table emails from scratch.

The sample email shown is a great Star Wars R2D2 version of the Xbox Live campaign. Randall Comm built out approximately 9 variants each in a different language. There were several other campaigns during the contract but this one was easily the most memorable. What a cool design idea.

image image

Innovyx

Randall Comm was provided assets and designs for a Toyota email campaign. Abiding by the most strict best practices, we built the email files utilizing Tables, inline and redundant CSS styles among other tricks to make solidly founded layouts that are reusable and easily modified.

Although it does not animate in the sample image, the 2nd email has a glowing center button to match the Toyota Drive What Matters Website. It gives a very strong focal point to the email and should help draw attention which is usually very challenging in the overflowing inboxes of most people.

image

Sweet Tee Graphics

new window icon Click to see live Website

Designed and developed the Website and online store. Used HTML and CSS (and some PHP) to build the site from scratch for a new screen printing company. Also developed store with the Foxycart system. This allowed us much freedom in the layout and design of the product pages. Tried to keep the focus on the main three categories of products - as seen on the homepage.

Randall Communications is continuing to work with Sweet Tee Graphics for adding site content, maintenance and improvements. Sometime in the future we will be implementing a content management system to allow an easy alternative for the owners to handle the products online.

image

Iron Horse Casino

new window icon Click to see live Website

Designed and developed the Website and social network. The old Flash site was dated and riddled with mistakes and missing content. Updated to a fresh looking HTML platform with CSS to style it out. Wanted to convey the excitement and action of the casino floor without appearing frantic. Graphics have a crisp and clean look, which helps the site "pop". Utilized large font sizes throughout and big icon links on the secondary navigation. The site build was very quick due to the tight deadline required.

The social network consisted of setting up a Facebook account, a Twitter account and updating the email system to Constant Contact. Gave those a consistent branding and voice across the board.

image

Evergreen Aero Tech

new window icon Click to see live Website

Client needed the full meal deal. From the branding to the Website design to the online store, this is the designer's dream of working with a blank slate. Started with logo and colors giving a very clean, almost laboratory feel because the client specializes in horticulture equipment. We wanted to give the brand a professional feel with hints of the product throughout. We photographed and handled the cleaning work for the entire product line.

The HTML based site is styled with CSS and features a clean white background with minimal graphics and photographs. We utilized site-rooted product pages that link to secondary online store pages for secure ordering. Since the store is using the Fatcow.com system, keeping the product pages and directories under our control was deemed necessary.

image image

Bandwagon application

Mocked up Facebook application interface and flowcharted the UX. Took direction from client and created very detailed mock-ups in Photoshop®. Had to consider all the different scenarios involved such as visitors coming from a user's application link, visitors coming in from the outside world, and the various steps of the application. These variables resulted in about 30 different final files for the development company to reference. Also created some very basic flowcharts to have a much simpler master reference.

image

Autism Citizen

new window icon Click to see working site

Tasked with designing everything from the logo to the fully functional Website store. The company wanted to start this charity-based online entity with no prior content to work with. Started with creating the logo and branding, which turned out to be one of our favorite logos made right here at Randall Communications. Gave the branding a easy, approachable feeling that ties in directly with the autism community.

The Website was worked out with a simple 2 ½ column layout with a heavy tendency toward social networking. The 2 large columns could be used for news stories, Facebook or blog feeds, store products, etc. The third column would be dedicated to store links and advertisements. Had developed the main site template, the initial store page templates and all pages to apply for a merchant account when the project was aborted for various reasons. Link is to the site currently hosted locally, but is still semi-functional including the main store page and the mug product page.

image

Guides To Coaching

new window icon Guide To Coaching Basketball live Website

new window icon Guide To Coaching Sports live Website

This was a very unique project that we revel in here at Randall Communications. The client had acquired these Websites which were initially created in the early 1990's when the Internet was still in it's infancy as the public knows it (why he had purchased such lengthy domain names at that time I cannot fathom, he probably could have bought basketball.com and sports.com not to mention anything else related). The sites themselves had not been touched in several years. The original owner had used a WYSIWYG editor to crank out page after page of coaching instructions. Because of the age and sheer amount of content the search engine ranking for these sites is very high and the new owner wished to retain that aspect. We went through hundreds of pages of code and updated, cleaned up, and modified where necessary. We brought the look in to the current decade with new logos and branding, fresh graphics, and a much more versatile layout (The Guide to Coaching Sports site was only partially completed before the project was terminated due to budget constraints).

After we had ended the project client attempted to update on their own. Links go to live sites which currently have all of our work intact, but probably will not eventually.

image

Chris Pratt

new window icon Click to see live Website

This is the ultimate project for a creative agency. Randall Communications was approached by famous Hollywood personality to give him a strong online presence. Wanted to go with a very humorous and not too serious feel to the entire project. We started with the logo and branding, creating an "alter ego" as the main theme of the site. Created in a way that is quickly changeable and easily expandable. Used a standard HTML and CSS foundation for the site, focusing on creating uniquely funny graphics and photos.

The social media presence is a huge part of the presence, so we tied those in very tightly utilizing the content from Facebook and a Wordpress blog.

 

TOP

See the archives