I design websites with the user in mind. I specialize in finding innovative solutions and apply a creative approach to interaction and interface.
Web Design; Custom WordPress Theme; Lowell, Blake & Associates
Web Design; Custom Wordpress Theme Client: Lowell Blake & Associates Scope: Design and development of custom Wordpress theme View the Site: http://lowell-blake.com Project Details: This particular phase of this project was to design the front-end of a new Wordpress site for the Lowell, Blake and Associates Law Firm in Massachussetts. This involved creating the concept for the user interface, which consisted of switching to a "long-form" homepage, coupled with interior pages that display further information. The long-form homepage has content sections which give "teasers" of info with links to read further.Read More
Web Design; Custom WordPress Theme; AlwaysFunnyinPhilly.com
Web Design; Custom Wordpress Theme; AlwaysFunnyinPhilly.com Client: Daylight Digital Media Scope: Web Design, Layout, Wordpress Theme Development, HTML/CSS(3), jQuery, PHP, Custom Interactive Animation(s), Image Manipulation, Illustration Project Details: Daylight Digital Media produces a variety of projects, many of which include websites geared toward the entertainment industry. This particular website is to serve as the future (official or unofficial, as yet undetermined) fansite for the television show It's Always Sunny in Philadelphia on FX Networks. This design features a very simplistic landing section, but with a surprise. Ther are a actually a series of animations that take place on the screen...Read More
Web Design; Custom Landing Page; Origin Technologies
Web Design; Custom Landing Page Client: Origin Technologies, Inc. Extras: Custom Digital Illustration Project Details:This design was created for the purpose of displaying a landing page, geared towards a specific market the client is targeting. I think it should be clear that this market is the financial services industry. The client offers IT services to these firms, and is now offering a cloud computing service that they wish to call attention to. This design was created for the purpose of displaying a landing page, geared towards a specific market the client is I created the illustration in the center of...Read More
Web Design; Custom Landing Page; QuantGo
Web Design; Custom Landing Page Client: QuantGo Scope: Conceptualize and design custom landing page Extras: Custom Digital Illustration (Flow Chart) Project Details: create an appealing layout/design for landing page, with primary focus on call-to-action and "hero" bannerRead More
Web Design; Custom WordPress Theme; Royal SEM
Web Design; Custom Wordpress Theme; Royal SEM Client: Royal SEM Scope: Web Design, Layout, Wordpress Theme Development, HTML/CSS(3), jQuery, PHP Project Details: Royal SEM is a full-service search engine marketing firm. They provide a wide range of services, truly giving you "the royal treatment". The goal of this design was to encapsulate the "regal" spirit of the company entity and to convey its underlying mission statement in a visual capacity Client desired a fully illustrated homepage, completely custom. I created several cartoon style elements, and incorporated them into the design. The overall intent here, is simply to gain visual interest...Read More
Emocion – The Sounds of Tango
New Website Development; Custom WordPress Theme; Emocion Tango
UI/UX Development, One page site developed as WordPress theme with custom functions.
Project Details: This custom WordPress theme was developed for the amazing “Emocion Tango” a brilliant group of performers. The theme is fully responsive for mobile, and has some interesting animations and features, including a custom contact form with ajax submission process and animation.
I cannot take credit for the design itself, which was completed by another party hired by the client. However, I handled every aspect of the development, including the responsive CSS. I also implemented a method to embed Youtube videos, with a preview thumbnail, and the ability to play by clicking the thumbnail with a custom play button vs. the default Youtube play button.Read More
Custom UI/UX; jQuery, PHP, HTML/CSS; Pricing Slider
Sliding Pricing Calculator UI/UX with WordPress Integration
Scope: Design and develop a sliding pricing calculator interface that simulates and actual sliding element that the user can slide up or down to alter the calculated results, with integration into WordPress.
Skills Required: jQuery/AJAX, PHP/MySQL, HTML/CSS, WordPress
Project Details: The purpose of this application is to provide customers with an interface to determine pricing. The different sliders can have default parameters set, and those numbers are increased as the slider is engaged. The increase is based on number of items at that price.
In order to accomplish this, I also made use of Google’s exchange rate API, in order to allow the user to switch between exchange rates, in order to see the difference in cost, and also to be sure that the results match their expectations (for international use).
This particular slider was integrated with a WordPress page template, in order to be integrated into a WordPress site. Therefore, it is theoretically able to be integrated into any install, and used with a different concept in mind. At some point, I will build something a little more complex, that can be downloaded and installed.
If this project interests you, and you’d like to know more about how I accomplished it, please feel free to contact me. Additionally, if you need a pricing slider, written in php, jQuery, and HTML/CSS, please feel free to contact me to discuss your needs.
Web Development; Custom WordPress Theme; Auxiliary Design Co
Web Development; Custom WordPress Theme; Auxiliary Design Co
Client: Auxiliary Design Co.
Scope: Development of custom WordPress theme, using provided design
Skills Required: WordPress Theme Development, HTML5, CSS3, jQuery, PHP, Mobile Responsive CSS
See the live site here: http://yourauxiliary.com
Project Details: This custom WordPress theme consists of a great deal of CSS3 transitions, jQuery manipulations, as well as custom PHP scripting. I made use of no plugins for this project, only custom code. Some of the key features are:
- Mobile Responsive
- Multiple navigation options with animation and automated scrolling
- Custom “reveal” animation for hidden work content
- All one page, giving high content potential for homepage
- Custom contact form script, no plugin
- Dynamic ajax contact form validation with error display
- Right side pagination-style navigation that animates with position
- Mobile hamburger menu, populated with content from full level menu
- “Raining” icons animation effect
- Custom spinning loading animation
Web Development; Custom WordPress Theme; CWA
Web Design & Development; Custom WordPress Theme; CWA
Client: CWA (via Auxiliary)
Scope: Web Layout Modifications, Custom UI/UX for Gallery, Mobile Responsive Conversion of Theme
Project Details: CWA is a high-end architectural firm. They had a pre-existing site, done in WordPress, that needed some updates. The goal was to convert their existing theme to one that would be responsive to mobile, to be sure the site was “mobile-friendly”. This consisted of writing new CSS declarations to cause the layout to adjust to the width of the device the user is viewing on.
Additionally, the gallery section needed a better method of organization and user interaction. We consolidated the gallery with a grid of thumbs above the “list-style” format of the items. Clicking one of these thumbs would bring you to the respective project. Each project was given one large featured image with a small row of thumbs underneath. Selecting these would switch out the featured image with that image, using jQuery. Where the thumbs exceeded the width of the container, a right or left arrow appears, allowing the user to scroll to the next set of thumbs.
Custom WordPress Search & Filter, New American Goods
Web Development; Custom Search/Filter & Browse Functionality; WordPress
Client: New American Goods
Scope: PHP, WordPress, jQuery, AJAX, HTML/CSS
Project Details:New American Goods is an online shopping platform that specializes in providing “Made in the U.S.A” products only. This way, customers can be sure that the products they buy were made in the United States.
The client had created a database of products in WordPress, using the custom post concept. These were also organized by custom taxonomies. It was my job to create a method of allowing the posts displayed to be filtered by combinations of selections by the user. For example, if the user wanted to see only those products in California, they would simply select “California” from the selections. They can then filter further by selecting product category, etc. This was accomplished using primarily AJAX with PHP and jQuery. I utilized some of the WordPress default functionality for some population of content, and then filtered that content using AJAX.
Client: Consulting Agency
Scope: Develop a standalone interactive infographic interface that returns comparative results via PHP and AJAX/jQuery.
Skills Required: HTML5, CSS3, jQuery, PHP
See the working example here: http://jondaydesign.net/interactiveinfographic/
Project Details: This is a standalone package consisting of an html file, a jquery file, a php script and a csv file. This can be installed on any server, as the csv data is automatically scraped by the php script. The results are returned via AJAX in the form of percentages of a whole. After the user enters their choices in the displayed form, the data is compared to the csv file to make calculations.
Each selection represents a piece of criteria that must be met to be counted toward the percentage. As more selections are made, the results are narrowed down further, resulting in a smaller percentage. The data is returned to the front-end interface, and displays are animated into view that show the results. I used a “counter” style animation for the percentages. The user is also automatically scrolled to the animation as it occurs, which happens in sequence (total of two…in the form of two blocks of two).
Logo Design & Branding
Carefully crafted, quality designs. Innovative, in-depth branding solutions. You will find no clip-art slapped next to a font here. Corporate Identity, Branding, Signatures, Trademarks, Trade Characters, Band Logos...you name it.
Logo Design; Bubblegum Graffiti
Client: Bubblegum Graffiti
Location: United States
Bubblegum Graffiti is an Etsy shop that sells popular and fun necklaces, embellished sunglasses and keychains for girls of all ages that are perfect for birthday parties, baby showers, weddings, bachelorette parties, fund raisers, dances, school events, and more.
This logo design is intended to give a sense of the fun & hip persona of the shop, providing it with a solid brand that can be easily recognized. The logo is used not only for the shop itself, but for promotional items, business cards, and other printed materials.
The design was hand-crafted with pen, then scanned in to create a digital vector file with embellishments.Read More
Print Design & Layout
Posters, Business Cards, Brochures, Menus, Tradeshow, Promotional Materials, Label and Packaging.
Print Design; Business Card
Print Design; Business Card
Quite some time ago, I was hired to do all of the graphics work for an emerging enterprise called “Vici Squared (Vici2)”. The name later became “MyVici”, but we went through an entire branding development for Vici Squared.
For this particular design, I actually also designed a small graphic that can be used separately as an icon, mark, or any other required branding element. Considering the purpose of the site, and it being related to connecting people, I decided to create a “grid” of profile pics. Atop this I overlaid the V2 image I created as an iconic branding mark.
The purpose of this card was to promote the site, but also to serve as a general-use business card. So, the reverse side of the card contains standard business information (title, address, email). I do not currently have the file I used for that design, but will seek it out and post it the next chance I get.Read More
Print Design; Tri-fold Brochure; Sleepwise
Print Design; Tri-fold Brochure; Sleepwise
This project was completed through an intermediary, and prefers to remain anonymous. I designed this brochure to be very “corporate” in nature, but while maintaining a pleasing and soothing aesthetic…it is a sleep clinic after all.Read More
Illustration & Multimedia
Illustration – Portrait
This drawing was done using pencil, pen and ink, colored pencil, and Prismacolor markers. The basis for the drawing was a photograph from a magazine spread, from which I deviated a bit with some creative liberty. The image used was really just as a base from which to build.
I first created the base sketch using a light 2h pencil. I then worked up a bit into some darkness using an HB pencil. As I did this, I also started laying a light layer of a flesh-like color of colored pencil. I continued this process until I had a basic flesh base.
I then started bringing some black ink in, in order to provide a dark element to make the image a bit more dynamic. It also helped to start giving some shape to the hair, which was quite dark.
In order to give the drawing a more “rustic” sort of a feel, I went back in and made things a bit grainier, by overlaying another layer of colored pencil wax, and then light hatching it with pencil. This chips away a little at the colored pencil, producing small granules of difference in color. It makes it look a bit more “rough”, which to me, seems a little more visually interesting to look at. Otherwise, you might as well be looking at a photograph.
In retrospect, I think I overworked the “roughness” a bit too much, resulting in a less professional looking image. In the thumbs of the progress, you can actually see a higher quality version (in terms of technique), where less flaws are present. Some flaws were revealed through this process of refining over and over, which, in the end, was not necessarily a benefit. In future attempts of a similar nature, I will avoid making similar mistakes.
Additionally, I left a few areas somewhat “unfinished”, in order to give it a bit more visual dynamism. I think that the lack of definite solidity gives more character to the subject, and allows the viewer a little more breathing room for imagination.Read More
Cthulu Illustration; Digital
This illustration was used for the logo design I created for Phantasma Publishing, a table-top game publisher. The client requested a Cthulu inspired design, and the examples provided were very illustrative. So, rather than a traditional logo, I created a combination of a logo design and a full-on illustration. I’ve included this as an illustration and a logo design.Read More
Hippy Girl Illustration; Digital
I created this digital illustration to be used as a profile image for a social media page for a client. The image was originally from a photograph, which I used as the source to create this digital illustration.Read More
Who I Am
Graphic Designer. Web Designer. Web Developer.
East Coast, United States
With over 10 years of experience, I've learned a lot. I've also learned how to take that experience, and apply it to your project.
I'm a 33 year old graphic designer, web designer and web developer, living and working on the East Coast of the United States. I have over 10 years of experience in the industry, having worn many hats. I'm currently working independently, creating high quality experiences in web, video and print. I enjoy challenges that force me to find innovative solutions, and opportunities to flex my creative muscles. My personal mantra is "where there's a void, there is space to create".
When I'm not working, I enjoy playing guitar, wood-crafting, and creating various things. I enjoy a good steak, beer or scotch, and enjoy a wide range of music, film, and literature. I also have a fairly in-depth knowledge of art history and philosophy, as well as a novice interest in physics.
- Mobile Responsive CSS ,
- HTML/HTML5 ,
- CSS/CSS3 ,
- Bootstrap ,
- PHP ,
- WordPress ,
- Mobile Responsive CSS ,
- Shopify ,
- Magento ,
- eCommerce ,
- Flash Animation ,
- Actionscript ,
- After Effects Animation ,
- Music & Video Editing ,
- Web Layout ,
- Typography ,
- Logo Design & Branding ,
- Banner Ads ,
- Icon Design ,
- Interface/UI Design ,
- Database Entry ,
- Pagespeed Performance Enhancement ,
- Working proficiency in French & Spanish
What I Do
Design & Dev <> Tips, Tricks & Thoughts
September 24th, 2016 by Jon Day
You all know I love WordPress. Well, I recently came across this great WordPress cheat sheet, which has a number of useful tips and tricks for WordPress. If you’re new to WordPress, a seasoned user, or even an advanced expert… I think you’ll find something of use here. If you can spare the printer ink,… Read more »
February 17th, 2016 by Jon Day
It’s actually quite easy. Just use this: $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); Then where you may need to use it, just echo $url. I typically use it when I need to set a background image for an element, especially those that need “background-size:cover”. Granted this does require placing that style inline, but it shouldn’t be… Read more »
February 13th, 2016 by Jon Day
There are a ton of custom post type plugins out there, but honestly, they are almost wholly unnecessary for developers. If you’re comfortable with editing some basic php code, you can create your own custom post type quickly and easily. Really, even those who are not familiar with PHP could accomplish this same task themselves,… Read more »
Would you like to hire me? Do you have a question?
Interested in hiring me for your project? You can either email me at email@example.com, or fill out the form below. Please be as detailed as possible, letting me know what your project consists of, the budget you have in mind, and your intended completion date. I look forward to hearing from, and working with you.