Mike brings a three-pronged passion for design, development, and information architecture to the table. He also brings some excellent illustration skills to the Wojo team.

Not only is Mike a super-talented designer and front-end developer, he’s also a very handsome fellow, as you can see:

We’re looking forward to working with Mike as we continue our quest to dominate the interwebs.

The post Wojo Design Hires Mike Henderson! appeared first on Wojo Design.

(excited? Go right to the source code on github).

What’s New?

Everything.

Well, sort of. Version 3 is not backward compatible with version 2 and was essentially rewritten from the ground up, but many concepts and methods have stayed the same. One of the big changes is that simpleCart(js) now requires jQuery, prototype, or MooTools. We found that almost everyone using simpleCart(js) is already using one of those libraries, so we might as well make use of their great feature set. You can use any of them, you just have to include at least one.

Adding to the Cart

You can create shelf items the same way as before:

<div class="simpleCart_shelfItem">
    <h2 class="item_name">Awesome T-Shirt</h2>
    <span class="item_price">$23.00</span>
    <a href="javascript:;" class="item_add">Add to Cart</a>
</div>

Adding to the cart with javascript is similar, but now uses an object for the item properties:

 simpleCart.add({
     name: "Awesome T-Shirt",
     price: 23
 });

Setup

simpleCart(js) now provides a simple way to set your options all at once, with the flexibility to update them at any time:

 simpleCart({
   checkout: {
     type: "PayPal",
     email: "you@yours.com"
   },
   currency: "GBP",
   taxRate: 0.06
 });

… And a whole bunch of new cool features

We built it from the ground up to provide new features and flexibility like an awesome new event system, a more flexible checkout, better currency options, and lots more.

Better Docs

This is probably the most important part about the release. With all of these new features, we needed a much better way for users to get the info they need to build great shopping cart sites. The new docs section of the site is an ever expanding collection of how-to’s and function references to make sure you know how to do anything. We also provide a comments section on the docs for users to post their own examples. As always, you can get the source on github and find support on the issues section.

Get Building!

We are excited to see what will be built with this release, and would love to get your feedback. If you have bugs to report or feature requests, you can post them on github or discuss current posts. Don’t forget to check out the documentation and features on the new site. Thanks!

The post simpleCart(js) v3 Released! appeared first on Wojo Design.

We are light on management and heavy on results; you must be able to work just as well independently as you do collaboratively. You should be interested in creating new things, like to solve problems creatively, and be passionate about your work. We believe arguing with your boss is a good thing, and refusing to accept anything you can’t be proud of is even better.

The person who fills this position could be found doing any one of the following at a given time:

• Collaborating with the rest of the development team to create user personas, information architecture, design sketches, wireframes and project quotes
• Designing ridiculously good interfaces for web/mobile sites/applications
• Creating HTML/CSS/JS code from your (or others) designs
• Reviewing designs/products/features with coworkers or clients to offer and/or receive constructive criticism.

Here are some rather boring things that a perfect candidate might just have on their resume:

• 3+ years experience designing and building interactive interfaces
• Expertise with the Adobe creative suite
• Experience with IA, UI, UX, and any other fun acronyms associated with building interfaces
• Working knowledge of HTML/CSS/Javascript
• A link to a really impressive portfolio

The ever-popular “Bonus Points” list that every job posting has:

Experience with:

• HTML5 & CSS3
• Javascript development with jQuery
• Building interfaces within an MVC framework like CodeIgniter or Ruby on Rails
• Building interfaces within a CMS like EE, WordPress, or Drupal.
• Mobile App/Website Design
• Version Control like Git or SVN
• Ninja stars or nun-chucks

Perks:

Flexible location & schedule, $2.5k to build your new work environment, 401k and health benefits.

Please send your résumé (no word docs please), link to portfolio, and salary requirements.

The post We’re Hiring – Interactive Designer / Front-End Developer appeared first on Wojo Design.

In this blog article I’m going to take a quick look at some of the strategic and design decisions we made with the client.

1.) Contact Information

Choosing a consulting firm is not a small decision and will certainly require some back and forth communication before a deal is set. The primary call to action is for the prospect to send an email or pick up the phone and initiate the discussion phase. We made it extremely easy to find the contact information – including it prominently in the header, the footer, and on the page body. The call-to-action button on the first slide in the slideshow encourages prospects to make that initial contact as well.

2.) Pull Quotes and Bulleted Lists

inFUSION Group had a ton of great content (it’s part of what they do!), but it can be tricky to keep it engaging on the web. We tend to glaze over at the sight of a paragraph longer than 4 lines.

To keep the reader engaged we made prominent use of pull quotes and bulleted lists, as you can easily see on the About Us page.

A very unique pull quote style really emphasizes the mission statement, and custom bullets are used in a list with plenty of whitespace for breathing room.

3.) Newsletter Signup Field

Attention to detail is very important for good design and user experience. We added a subtle effect to the newsletter subscribe field – when the field is active the small mail icon “opens.”

Thanks to inFUSION Group for working with us on this exciting project!

The post Client Case Study – inFUSION Group appeared first on Wojo Design.

There are 4 different states you can be in while using Authorize.net: (1) live server, (2) live server in test mode, (3) sandbox server, and (4) sandbox server in test mode. Any API keys you generate while in one of these states will only work in that state. So if you generate a transaction key in test mode and then switch back to live mode, you will need to generate a new one and update your code base accordingly.

Sandbox in Test Mode: As far as I can tell, you will never need to use this.

Sandbox Server: When you sign up for a test/sandbox account, you can checkout with a few different card numbers that they will send you. This test account is completely separate from your live account.

Live Server in Test Mode: You can put your account in test mode in order to make some purchases on your site. I know that the Visa test number 4111 1111 1111 1111 works in test mode, but I’m unsure if there are other test numbers that work. As far as I can tell though, transactions put through in test mode won’t show up when you are using the Transaction Details API.

Live Server: Transactions here will be put in the “unsettled” transactions for up to a day before clearing. In order to test code using the transaction details API, we often put through a real transaction on the live server, and then void it after we test.

Common Errors

There are several cryptic error codes we have come across; here are a couple that we eventually were able to fix.

 The merchant API Login ID is invalid or the account is inactive.

This is what happened for us when we generated an API transaction key when in test mode, and tried to use it in live mode. The solution was to just regenerate the transaction key.

 The Nova Bank Number or Terminal ID is incorrect. Call Merchant Service Provider.

If the Merchant Service Provider isn’t set up within Authorize.net, you will get this error. The good thing is that this has nothing to do with your code or API setup.

If you’ve got any other tips and tricks for working with Authorize.net, please post them in the comments below.

The post Authorize.net API Setup appeared first on Wojo Design.

Motivation

While using cookies for cross browser client-side storage was a clever workaround a few years ago, it just isn’t an acceptable method anymore for several reasons:

EU Cookie Law: the EU has created a directive that requires websites to ask permission to store every cookie. While this is still being heavily debated, it’s a good reason to tread lightly when it comes to overusing cookies.

Performance: web performance optimization, thankfully, has become an important consideration for every website. Cookies are sent along with every request, so the more data we store, the larger our requests. This has a much larger impact when we consider sites with heavy ajax requests, where the majority of the size of the requests can be in the headers. With a lot of local storage data, you could easily be adding 4K or more to every request. These performance issues are nothing new, so we should avoid using cookies for storage whenever possible.

Implementation

Currently, localStorage is supported by Firefox 3.5+, Safari 4+, IE8+, and Chrome. To fill in the older browsers, we used userData for IE6-7 and globalStorage for FF2.x & 3. The interface is identical, regardless of how it is being implemented. This is very important, so code can be consistent as support for older browsers is dropped. Once all major browsers support the spec, the script can just be removed.

localStorage.setItem( key , value );
 // saves a new name/value pair if the key doesn't exist, otherwise updates the value

localStorage.getItem( key );
 // returns the value associated with the given key, if it exists
 // returns null if the key doesn't exist

localStorage.length;
 // the number of unique keys stored

localStorage.removeItem( key );
 // deletes the name/value pair with the given key, if it exists
 // if it does not exist, exits

localStorage.clear();
 // delete all name/value pairs currently stored

localStorage.key( n );
 // returns the name of the nth key in the list, will return null if n is
 // greater than or equal to localStorage.length

You can get the code on github – simply add the script to your page and you’re all set.

The post Full Browser Support for localStorage without Cookies appeared first on Wojo Design.

The full intern listing has been posted below. Please submit your application to

Wojo Design is a full-service web agency that helps clients at every stage from initial website design to online marketing and social media campaign implementation. We are seeking an ambitious and self-motivated web design intern who can take on a wide range of responsibilities.

RESPONSIBILITIES;

• Building basic HTML websites.
• Creating basic web design compositions.
• Formatting and editing images to be used on client websites.
• Cross-browser testing.
• Updating client websites.
• Performing keyword research for search engine optimization campaigns.
• Building links to internal and client websites.
• Updating social media sites internally and for clients.
• Reviewing and proofreading proposals.

REQUIREMENTS;

• Proficiency in Adobe Photoshop
• Know your way around Microsoft Excel
• The ability to upload files with an FTP Client (Transmit, FileZilla, etc.)
• A good understanding of HTML and CSS and the ability to turn a simple design into a web page.

BONUS POINTS;

• JavaScript
• PHP experience

This internship position will provide an excellent learning opportunity as you will work on a wide variety of projects and tasks. During the course of the internship you will become proficient with several content management systems, work on many web design and web development projects, participate in online marketing campaigns at all stages, and work closely with the company founders.

DETAILS
This position is open immediately and will be filled once the appropriate candidate is found. This is a 4-month internship with the possibility for extension. You are expected to work around 20 hours a week on average, however, we can be flexible to meet the needs of your schedule. You will be paid $12/hour.

We have an office in Ann Arbor that you may work out of, and at times you will be expected to meet there. However, if preferable you can also work from home on a regular basis. We are very easy to work with, and as long as you get the job done and work hard, we’re happy to be very accommodating.

Please send any examples of past web design and/or development work.

The post Wojo Design is Hiring an Intern! appeared first on Wojo Design.

For the impatient, you can view the new code on the v3 branch on github: http://github.com/wojodesign/simplecart-js/tree/v3

Whats New?

The code has been rewritten from the ground up, and there are too many improvements to cover in this article. Some of the best updates include completely cookie-less storage with HTML5 localStorage, lots of events to handle all the customizations you could think of, plugins and extensions, more flexible formatting, more checkout options, better language and currency support, better performance, and easier syntax

How can I help?

The easiest way to help is to periodically visit http://swarm.simplecartjs.com and click “Join the Swarm”. We are striving to make sure simpleCart(js) works with other libraries and in every major browser; by simply visiting this page TestSwarm will run our tests in your browser to help achieve this.

You can also help by trying out the new code on a site. We have already tested a lot of the basic features, but getting the code on more sites will help us track down bugs and improve the usability and features. The documentation is a work in progress, but here are a few big points about using the new code:

New Options and Syntax

When setting options for simpleCart(js) v3, you simply send a settings object to a simpleCart() function:

 simpleCart({
   tax: 0.08,
   shipping: 10,
   currency: "USD"
 });

The option formats have changed a bit; you can see all the available options in the README.

jQuery, Prototype, or Mootools

simpleCart(js) v3 will require a library, such as jQuery, Prototype, and Mootools. A lot of thought has gone into how to work with every library and keep simpleCart(js) small and manageable. It turns out, almost every site that is using simpleCart(js) is also using one of these three libraries, so it made sense to use the expertise and hard work that goes into those great libraries to handle things like DOM manipulation, CSS selectors, and event handling.

The best part is that you can use any of these libraries interchangeably, and simpleCart(js) will simply figure out whats included and use it. Right now, these libraries seemed to cover the majority of sites, but if there is a strong request for others, we will try to include support.

The post SimpleCart(js) V3 Beta appeared first on Wojo Design.

We are proud to announce a brand new version of Motionspire – the world’s premiere motion graphics inspiration gallery. Motionspire is the best place to go when you want to see the best motion graphics work available online.

We launched Motionspire 3 years ago, and we’ve been pleased with its growth over the years. Today we are launching a brand new video submission process that makes it easier than ever to submit your work. Many motion graphics pros already have their work available on Vimeo, and if you submit a link we’ll automatically pull in all the information and queue the video for review. If you’d prefer to upload your video directly, we accept .mov, .mp4, .m4v, and .flv files up to 50MB in size.

Another new feature makes it much easier to find the inspiration you are looking for. You can select multiple categories at the same time, so if you want to see 2D Title Sequences or 3D Commercials with a Typography focus, it’s just a few clicks away.

We have big plans for Motionspire’s future as well, including keyword search, custom user portfolios and a job board for motion graphics professionals. Keep checking back at Motionspire.com for new developments, and while you’re at it, take a look at some of the best motion graphics videos ever made.

The post Announcing the Launch of Motionspire V2 appeared first on Wojo Design.

However, another project we’ve had in the works for quite some time is HelloRent.com, an apartment finder that doesn’t suck (in our humble opinion). We’re really excited about this project and we believe it has the potential to shake up the industry. Recently we have been focusing almost all of our efforts towards HelloRent. Thus, we have not been able to devote any significant time to development of our other projects, blogging, or client work.

Although we wish we could do it all, we have to be realistic with our time constraints and our abilities. Thanks to everyone who has supported us so far, either by reading this blog, visiting one of our creations, or spreading the word about what we’re up to here at The Wojo Group. We do plan to eventually return to more frequent blogging, and someday we will hopefully have the time to continue developing our other projects. In the meantime, though, please feel free to head over to HelloRent.com, subscribe to our email newsletter, and request an invite if you are interested in giving it a try. As always, we’d love to hear your feedback.

Thanks again for your support.

The post Update from The Wojo Group appeared first on Wojo Design.