214-310-1356
2013 was a great year here at Advice. Internet marketing is booming and web design and development are growing at an incredible pace. We asked the members of our design and development team to talk briefly talk about what tricks, tips, and tools they learned in 2013.
Ryan Nielsen
One of my favorite finds this past year was Zapier, a tool that allows you to easily connect web applications. We’ve used it extensively at Advice to handle communications between Salesforce and Wufoo, as Wufoo’s direct integration was unavailable to our organization. I couldn’t be happier—long gone are the days of grepping server logs trying to track down reports of lost leads.
The number of integrations they offer is stunning to me—there are so many creative things you could do with it with little or no programming effort.
Andrew Taylor
This last year I used ColorZilla’s Ultimate CSS Gradient Generator for nearly every front-end cut-up I did making it the most used new tool in my workflow. The tool is described as
A powerful Photoshop-like CSS gradient editor
and it delivers. I like that it provides output not only in old-fashioned CSS but also as SCSS/Compass (I am a big fan of Compass). The feature that makes this a must-use tool for me is the ability to import images. I can take a slice of gradient background from Photoshop, upload it, and have the CSS I need to produce the gradient in record time. No more trying to recreate the gradient manually in CSS, and our sites get the benefit of using CSS3 gradients instead of images.
The other tool I have used frequently is stypi.com. Stypi’s definition of itself is:
A realtime editor that allows multiple users to make changes to a single document at the same time. All you need to do is share the URL with others to begin collaborating!
Think of it like Google Docs for coding. This comes in handy when you need to collaborate with another developer on a quick script or to troubleshoot an issue.
If you are looking to collaborate on an entire project, and not just a quick file, check out Cloud9 IDE. You can manage an entire project and even connect to services like GitHub, BitBucket, Heroku, and more.
Being a terminal nerd my favorite feature of Cloud9 is that is has full shell access and a terminal console at the bottom when you are in the editor. No right-clicking and creating a new directory when mkdir will do.
Andrei Podlesny
One of the most asked questions for me is, what is that font? Online font recognition services come to my rescue every time.
There are several ways to recognize the font image. Here are some of those than I use most often:
I also sometimes get requests for creating screenshots of websites that can be used within a site as an image. Here are the sites that I find most helpful to do this:
Anthony King
2013 has been a great year for new design trends. “Flat” designs were popular, providing a focus on content and efficiency in design. 2013 was also a great year for jQuery infused designs, with full-width, stretched background images and parallax designs that bring fluid movement to any design. To keep on top of these latest trends and see what’s coming down the pipe, I make good use of reference sites. Some of my favorite collections include:
I also appreciate online tools and make use of a good variety of them. There’s many that I use, but I find that there’s no better collection than Piccsy – Everything Design. This site is an absolutely amazing resource for everything from Photoshop brushes, to design inspiration. Any tool I might need, or icon I might employ in development, I find available through this one great site. After getting a bit of design inspiration, I can then use Piccsy to get all the tools I need to put something together. It’s a great combination and has definitely made me a more efficient developer.
Austin Gray
2013 has been a year of growth and discovery for me as a developer. I would like to give a nod to some very cool services and technologies that have piqued my interest: I have dabbled with Meteor, Sails.js, the broader Node.js platform, as well as the deployment service Nodejitsu. I have tried my hand at some fun WebGL projects a la the very cool Three.js library. I have also been titillated by some creations I have yet to get my hands on like the brand new web scraper Kimono, or the just announced javascript html5 rendering engine famo.us. However, I feel I should give the real shoutout to some pretty awesome scripts that I have used in production. They may not be brand new, but their usage for me is and I would like to share them.
The first is html2canvas. A lot of our clients are small businesses that provide real services, whether it be plumbing or heating and air conditioning. They also provide specials that change on a regular basis. This results in a lot of updates. To expedite this process I created a coupon plugin that lets someone in the admin panel upload a background image and overlay text. The problem was when using fancy Webfonts that sometimes the way they print is not the same way they render in the browser. To fix this we needed to convert them to images. This is where html2canvas came into play. Using it we could easily convert the div and its contents to a canvas element, and then convert our canvas element using php into a .png file. Voilà!
The second is StackBlur. While there are several solutions for creating a javascript blur, I chose this one because the use was easy and the results were beautiful. We had a mockup for a website with a very cool looking banner. The focus was a regular rectangular image and the background was a blurred out version of the same image, but very enlarged. The problem was the client wanted to be able to change the banner image at their discretion so we needed to automate! I was able to increase the size of the image with php but for the life of me I could not recreate the blur effect, and I tried very hard, believe me. A brief search (one that I should have done sooner but I hate admitting defeat) led me to StackBlur, which easily recreated our look, and in turn saved my little project.