Top 10 Cloud Applications for Web Designers and Developers

While cloud technologies and applications have been around since the dawn of the Internet, they’ve caught on in a major way during the past two years. Cloud-based storage, computing and collaboration applications make everyday life far easier and more convenient for the average Web user.

Web designers in particular have benefited greatly from the rise of cloud applications for designing, modifying and debugging layouts. Cloud applications are a must when it comes to improving efficiency and productivity for web workers in a variety of industry sectors. Here are 10 superb cloud services that every web designer can use to make the work day go more smoothly.

Cloud Applications

Codeanywhere

CodeanywhereOnline IDEs for belting out markup, writing Javascript snippets and brainstorming ideas on the go are steadily gaining traction with designers who like to be able to work from any location. Codeanywhere is one such browser-based coding tool that provides a stellar environment in which to prototype layouts from a tablet, mobile phone or laptop.

It runs entirely in the browser, and features an FTP client, Dropbox integration and a slew of mobile apps for every device from the iPhone to the BlackBerry Playbook. Codeanywhere also boasts syntax highlighting for HTML, PHP, Javascript, CSS and XML, as well as a Sandbox with MySQL support.

Dropbox

DropBoxSwapping files with fellow designers has never been easier thanks to Dropbox, the beloved cloud storage service that’s the undisputed king of filelockers. Dropbox gives users 2 GB of storage to start with, though you can gain an additional 500 MB of space for every person you refer up to 16 GB.

Dropbox is one of those apps that just about anybody can make use of, but it’s particularly valuable to teams of web designers collaborating on a project. It even features a basic form of version control whereby users can recover older versions of files from the past 30 days.

GridFox

GridFoxCreating layouts that render properly across a wide variety of screens is frustrating, which is why grid-based web design has become such a big draw among designers. Frameworks like 960.gs, Blueprint and BlueTrip make laying out a gorgeous design quick and easy for designers who need to prototype fast.

GridFox is a free extension for the Firefox browser that superimposes a semi-transparent grid over any web page with the click of a mouse button. It also allows users to make modifications to grids and save them to the cloud for later usage in other layouts and designs.

Adobe Kuler

KulerAside from typography, color palettes are arguably the most important aspect of web design. The Adobe Kuler application allows designers to create various palettes consisting of up to 5 shades and hues for creating a theme on any website. It’s compatible with practically every program that falls under the umbrella of CS5.

You can export color palettes created in Kuler to Fireworks, InDesign, Illustrator and Photoshop. Users can also import photos and use Kuler to whip up a palette based on the dominant colors found in any image. If you spend a lot of time working with CS5 tools, Kuler is a must.

Pixlr

Much like a cloud-based version of Photoshop, Pixlr is a lightweight image editor that runs in your browser window. Pixlr boasts all the basic capabilities you’d expect from any editing suite, including the ability to crop, paint, magnify and draw. Pixlr is available as a browser-based web application and also as a mobile application for iOS and Android.

You can even filter images and apply various retro vintage effects as you would with Hipstamatic and Instagram. While import and export capabilities are a touch limited, it still provides a handy way to edit and modify images on the fly without using a more resource-intensive desktop program.

Evernote

The ultimate digital scrapbook, Evernote allows you to save resources you stumble across while browsing online. This comes in handy when you’re doing research on a particular web design technique or just looking for inspiration. Evernote can save entire websites, pictures, video files or just screenshots of interesting pages.

Free users are limited to about 60 MB per month worth of storage, though paid accounts offer up to 1 GB of cloud space per month. Evernote makes the bookmarks bar of your browser practically irrelevant, and it’s a good investment if you need an easy way to organize your research.

GitHub

GitHubWhile it’s more commonly associated with hardcore back-end coding, GitHub is also well-suited to the needs of designers. Independent web design professionals can upload CSS resets, front-end frameworks, icon sets and a whole lot more. If you’re looking for a proven markup tool or framework to make the design process easier, you can probably find it on GitHub.

It hosts such groundbreaking tools as Bootstrap from Twitter, the Gridless responsive design framework and the Skeleton grid layout engine. For millions of web designers and developers around the world, GitHub is an absolute godsend.

Typetester

TypetesterThe key to many a stellar design is unique, eye-catching typography. Choosing a font is a delicate process, as even the most subtle of changes can have a big impact on the overall look and feel of a web design. Typetester gives designers a browser-based tool for comparing three different fonts simultaneously side by side to see which one works best.

Users can vary the font size, family and spacing as well as the color of the text for good measure. Typetester is 100% free to use and doesn’t require the installation of any software as it runs entirely in your web browser.

CSSDesk – Online CSS Sandbox

While CSS has vastly expanded what’s possible when it comes to crafting stunning web designs without the use of Flash and bloated image files, it’s gotten far more complicated as of late. Crafting CSS markup that’s supported across all of the major desktop and mobile browsers is always a pain, which is why CSSDesk is such a handy tool.

Using its simple yet full-featured UI, you can specify elements like boxes with rounded corners that you may need for a design and CSSDesk will spit out the appropriate markup.

Final Word

There’s no shortage of cloud-based tools available online for web designers crafting the next generation of websites and applications. Whether you need a browser-based image editor, a coding IDE or a digital organizer to keep your ideas straight, there’s a cloud application out there that will get the job done.

The exciting thing about designing for the web in the cloud is that we’ve just barely scratched the surface of what’s possible with cloud-based tools. Over the next few years, you can expect to see many more innovative cloud applications that will fundamentally change how web designers build their projects.

Natasha is writer and blogger, tech lover, interested in various technology and internet topics, currently writing for Ninefold , exploring everything related to cloud computing technology, cloud server, virtual machine and cloud hosting.

Newsletter

11 Comments
  1. Paul May 24, 3:56 pm

    If you are going to include Dropbox in this list then I think we also need to add Google Drive.

    Reply
    +1
  2. arsado May 24, 4:09 pm

    I’ll suggest invisionapp.com instead of Draftboard!

    Reply
    0
  3. Agustin May 24, 10:20 pm

    Paul, I think Dropbox it’s just an example, as she could have chosen Google Drive or SkyDrive. Both are valid options. Great Article! I’m sort of a “starter” and I love to discover this tools all over the web.

    Reply
    -3
  4. Previewdump May 25, 12:07 am

    How about Previewdump? Here designers can store there designs on a very awesome way that make’s you design looks like it’s in html&css.

    Reply
    0
  5. Jerry Hepperle May 25, 12:54 am

    a little thing from ADOBE called Creative Cloud????

    Reply
    0
  6. gail May 25, 3:46 am

    Great article! Is there a good site that is similar to InVision or Draftboard, or even ProofHQ or ConceptShare, that a team can record comments to a live site that is in Alpha or Beta phase? So interactive elements, or rollover over states can be tracked & commented upon once coded? Thanks!

    Reply
    0
  7. Mike May 25, 5:42 pm

    I would definitely recommend web designers and their organization to start using SyncBlaze which is a great solution for file sharing and collaboration. Web designers usually handle large files and it is always difficult to share them via email or FTP, so SyncBlaze makes your sharing easy and you can always collaborate with others. The best thing is that its not only files, we can even create and share notes and also manage bookmarks. Now, we can bookmark articles from the web designer community, or create quick notes from forums and share with our colleagues.

    Reply
    0
  8. Urbandigital Jul 13, 12:08 pm

    Think about http://owncloud.org/ – there is a lot of pottential in this OpenSource Solution. You can host your own cloud by yourself and extend it with plugins. So, as you said ‘in the next few years’ i think those plugins related for webdesigners will be available also on this. We should support this project as it is awesome now and will be better and better when we support it!

    Reply
    0
  9. Steff Aug 28, 3:51 am

    I’ve been using Workflow Max (http://workflowmax.com) for my project management, time tracking, file management and collaboration for my small agency. Going cloud has been a great investment for us as we’ve found our team is more productive than ever. Workflow Max integrates with Xero accounting (pretty much the easiest cloud-based accounting system I’ve tried), and has a time tracking widget you can use from the Creative Suite.

    Reply
    0

Leave a Reply

*
* Minimum length: 20 characters