The goal was to create a music discovery application that provided users a unique experience in finding the best in Christian and Gospel music. We’re pretty excited with the results!

Check out the new app — now playing on Spotify!

This past spring we designed and developed a fun project called ‘iART Health’.  Sponsored by Health Teacher, iART Health is an art contest that gives students the opportunity to creatively illustrate how to making a healthy choice leads to physical, emotional and/or social health.

Our challenge presented to our team was how to display these hundreds of posters in a creative and organized way without feeling too busy.  As the designer I knew I wanted to incorporate illustrations as well as a grid system to display the posters.  Our developers did an amazing job using Isotope, a jQuery plugin, to create a dynamic and responsive grid system.

To learn more about iART Health and to see the work we created, visit www.iarthealth.com.

The judges would then review your work and score it based on code (cleanliness, semantics, and validation); user experience (respect for design, good choice points, interactions); and support (modern browsers, legacy browsers, size of project, resource optimization).  In the judges hands rests the responsibility of deciding one grand prize winner, 2 second place winners, 2 third place winners, and 20 runners-up.

A few Centresourcers were up to the challenge, here is what they had to say about the experience:

Mike Calhoun

The big thing that jumped out at me with this design was how EVERYTHING had a textured background associated with it. After that initial shock, my attention turned to points that seemed like they could have some kind of user interaction. There were none specified by the designer and the rules had specified that it was left to the coder to decide what (if any) they would like.  The obstacles section was an obvious choice for some kind of hover/transition.  The count down clock and form area also seemed like something that would have an room to explore with whatever I came up with while creating the markup. After a closer look, a few other smaller nuances caught my eye such as the small transparent border at the end and beginning of each section, the text shadows and many of the headings, or (again) the textured background.  In the end, I made a conscious decision to try and keep this as small as possible in terms of the file size and sacrifice complete compatibility for items like the above nuances in legacy browsers.  Although this probably hurt me in terms of scoring, I thought it would be more beneficial to learn newer practices for HTML5 and CSS3 versus supporting Internet Explorer 6 (which honestly has not been something I’ve thought about for a few years).  The trade off worked out well for modern browsers as everything looked pretty close to the design and I was able to use lots of CSS3 properties to accomplish the gradient background effects (rgba transparent backgrounds with a gradient image), font face properties for all the non standard fonts (allowed for the ticking clock), and extensive use of the jQuery animate property for my transition effect on the prizes section. In all, this was a  great experience that should pay off in the long run for applying new process to future work.

Travis Roberts

Mike went over the different sections/elements of the design, so I’ll talk about some of the tricks I used to accomplish the design while still keeping file sizes nice and small.

First, I exported all of my images as transparent GIFs instead of PNGs. The judging gives points for compatibility with older browsers, and everyone’s favorite browser to hate, Internet Explorer 6, doesn’t support transparent PNGs. The image quality of the exported assets were comparable as GIFs, the file sizes were much smaller, and they work with IE6 without having to do any weird hacks. By using GIFs, the total size for all image assets clocked in around 868KB.

Second, I used a CSS3 library (Animate by Daniel Eden) to accomplish all of the effects/transitions. This may seem counterintuitive to my previous paragraph about older browser compatibility. My thought was that effects/transitions are progressive enhancements. The site will still work fine without them, but they add a little polish to browsers that understand them. Because I used the CSS3 library for my effects, the only external javascript file I included was jQuery. This allowed my total project size to be relatively small (~1.1MB zipped).

My entry: http://cssoff.csclientsite.com/troberts/

In your development environment file at /config/environments/development.rb, place the following command in the <Your App>::Application.configure block

ENV["RAILS_ASSET_ID"] = ''

Voilá! Timestamps gone in development.

As a manager, you set the weather.

Our CEO, Nick told me early on “you set the weather for your department”.  At the time I had never heard the expression before.  Here’s how I understand it…  do you remember when you were a kid?  You came home from school, finished your social studies homework and curled up on your family’s corduroy couch.  You armed yourself with a bag of pretzels in one hand, Capri-Sun in the other and an episode of Thundercats on the TV.  Life was sublime… that was until your dad walked in after a bad day at work.  You didn’t know exactly what it was, but in an instant you could feel the entire climate of the house change.  You were suddenly nervous that the TV was too loud, you franticly cleaned spilled pretzel crumbs and feverishly went through a mental list of overdue chores you had yet to complete.  You were just waiting for the parental hurricane to blow your way.  The same is true in management.

As a manager, if I don’t mentally buy into a new policy, system or project my staff will sub-concioulsy pick up on those feelings and manifest them throughout the department.  As a person in leadership your first priority should be your attitude – if you love your job and your company, and project those feelings with intentionality, chances are the morale of your team will improve exponentially.

A company’s value is the sum of it’s people.

As cliche as it sounds, I didn’t really understand the depth of this principle before this particular position.  Centresource at any given time has a mosaic of founding employees, brand new hires, single 20-somethings, married 40-somethings, night-owls, early-birds, authors, coders, designers, musicians & competitive eating champions.  This dynamic and ever changing make-up, removed from talent or aptitude, actively sets up the entire culture of the organization.  People don’t often give due credit to the weight of a company’s culture on it’s overall performance.  As a manager, it is your daily (and typically unscheduled) duty to navigate these sensitive waters.  If someone feels for instance devalued in a particular exchange with a co-worker, it is your job to investigate what brought them to this point and how to initiate at times company-wide changes to make sure the situation never happens again.  Learning how to be a culture-protector is definitely not part of the job description, but turned out being one of the most rewarding parts of the job.

Problem-solvers are a manager’s most valuable asset.

Probably my biggest personal take-away from my time here at Centresource is the deep appreciation for problem-solvers.  I would rather have 5 problem-solvers working for me than 1 wildly talented, rock star, rich, good-looking, successful problem-finder.  You know the old chinese proverb about teaching a man to fish (if not, look it up)?  Do you know why he really did it?  So the guy would leave him alone and go away.  Your staff doesn’t realize it but constant low hanging questions are kryptonite to a manager’s spirit.  Sure there are some we have to field, but in my experience most questions asked of me on a daily basis are well within reach of the person asking.  Problem-solvers within a company are worth their weight in gold.  The person that comes up to me and says, “I found this problem, I researched it, I asked some folks about it and I came up with these 3 possible solutions.  What do you think?” would get a kiss directly on the mouth (we are still working though the HR ramifications invoked by that stunt).  There are some amazing problem-solvers within the ranks at Centresource… and to them I am forever grateful.

In conclusion, it has been an absolute pleasure working here.  I will take away nothing but good memories and always think of my time here as an invaluable step in my professional journey.  Many thanks to the entire staff – keep up the world-class work!

Editor’s Note: Jason is leaving the Centresource family to become a partner at Tyemill, a company that specializes in ecommerce solutions for active brands. We wish him all the best in his future endeavors, and trust he won’t become a stranger (he’s already threatened to crash our annual retreat)!

A logo design is the most important and cost effect effective element of branding.

What happens when you want to re-create your logo? Rebranding can be difficult to do, especially if there is an emotional attachment to the logo.  For example, the Gap and NBC attempted to rebrand their logo this past year and it cause a huge uproar.

Here are a few tips to keep in mind when redesigning your logo:

1. A majority of customers and people have a difficult time with change, especially if they have an emotional attachment.  If the logo only needs to be brought up to date a bit, consider not changing the entire image and try simply updating the font choice.

2. Make sure you can still recognize the brand.

3.  Determine who your core audience member is. The target market, customers, shareholders, employees, partners, vendors, community. Each one of these groups have are involved in some degree in the organization. Who’s opinion matters most?  Being clear about this makes the process of rebranding so much easier.

4. Your business’ brand is more than a logo. This includes your web presence, office space, print materials, apparel, signage, advertisements and communications.

5. Put together a team of project managers (cough, centresource) around you to help keep account of all aspects of your brand when forming a new logo.

6. Rebranding should result in not only a different “look” but also a different “experience” for your ideal customers.

“If paying is a deal-breaker, then Travis Roberts, developer for centresource, recommends Redmine, which has “great version control integration,’ “

We love collaborating with .Net Magazine and look forward to more in the future!

Check out the entire article here.

Here at centresource, we’re not the only ones who love to use these fonts.  According to the Google Web Font Blog, they now serve roughly 50 million daily requests.  Growth picked up considerably after Google Web Fonts announced over 20 new font families for the New Year.

One of the best attributes to these fonts are that you can either download the font or simply copy and paste the stylesheet link and CSS into your pages.  That’s it, you’re done!

The site currently has 174 fonts available for use and I’m looking forward to seeing other fonts added in the next few months.  Cheers to Google for continually making the internet more beautiful and fun.

The project began in Nov of 2010 and is almost complete.  Here are few examples of my favorite designs thus far…the Texas design *almost* makes me want to go to Texas.  I’m still holding out for Tennessee and will purchase one immediately!

To keep up with this project, follow ‘Fifty and Fifty’ on Twitter here!