It’s essential for designers to stay on top of the ever-growing list of galleries, apps, and tools that can be found. But at this point, there are so many great design resources on hand that sometimes it can be overwhelming to attempt a survey of them. So instead, let’s focus in on the ones that you’ll really find yourself returning to, day after day. For inspiration, we’ve rounded up three resources with completely different scopes and subjects; in combination, they might be all you need to get yourself going on your next project. For tools, we’ve made selections that reach out to all the different design disciplines; whether you work primarily in print or web, alone or in a group, you’ll find a great timesaver or two.
Inspiration
Get a Broad Scope: Designspiration
Although you can browse through images from any creative field, such as architecture and photography, everything in this huge compendium of inspiration can be brought back to great design. It’s a perfect source for when you want to see a visual feast to get the ball rolling; the interface is clean and simple; you just have to start typing to enter search terms (you can also browse by category or color scheme). Users can submit their own portfolios, make collections, and follow other collections too.
Narrow in on a Specific Subject: Pattern Tap
When you’re designing a web page, it’s important to be aware of the past and current trends and practices. Sift through hundreds of curated examples quickly and easily with Pattern Tap; categorized into types (404 pages, signup), styles (clean, sketchy), or user tags (typography, icons), it’s a breeze to sort through. You can also view by popularity, join in discussions, and save favorite images.
Hone UI Details: UI Parade
After getting a sense of what’s out there in terms of general and specific design inspiration, you’ll also want to look around for ideas on those specific elements that make a site a pleasure to use as well as look at. UI Parade is perfect for this purpose; it narrows in on those essential buttons, knobs, search boxes, and more, each entry providing a concise explanation of the reasons why that particular element is worthy of being showcased.
Tools
Share and Collaborate: Cage
Beloved by users for both its elegant interface and thorough functionality, Cage lets design teams share, discuss, and revise projects on an online platform. This allows continuous updates, revision tracking, task assignments and due dates, and other methods of streamlining your process. Cage sets itself apart from similar sharing tools by its attention to detail; you can add discussion points to a video directly in the timeline; you can archive and later reactivate projects. Best of all, the dashboard for all your projects
is incredibly intuitive and comprehensive, featuring a stream of recent activity, a rundown on your “Overall Status” and other helpful notifications.
Gather Stock Images: Shutterstock Lightbox
Quite often you’ll be looking through stock photos for your current project, but you keep seeing images that would work perfectly for something else. Instead of trying to remember your search terms a few months down the road, use Shutterstock’s Lightbox function, which allows you to save and categorize images for later use. Sharing is easy, and can be done through email, Facebook, or Twitter.
Develop Wireframes: Justinmind
One of the best options out there for quickly prototyping applications, this tool makes it easy to add complex interactivity, such as mobile gestures (swiping, pinching, and so on) as well as mouse overs, drag-and-drops, and conditional navigation. Wireframes can be exported to HTML or specs documents, and it’s easy to simulate forms, along with validations or other messages. Master templates allow you to define style guides and apply universal changes, an essential to streamlining your process when you’re
working with a group of related wireframes.
Preview Sites in All Browsers: BrowserShots
An incredibly simple tool that you need not even register for, BrowserShots allows you to select all the browsers that you’d like to check for compatibility in your latest web designs. Then all you have to do is give it a few minutes to create screenshots for each preview. The tool might not be as pretty or sophisticated as the others in this list, but it turns the loathed compatibility test into the least irritating task it can possibly be.
Hopefully this list has introduced you to at least a few new resources to explore; in time, they might well
become the must-haves that you won’t believe you lived without!
Thanks Luke for the tip on BrowserShots! I never knew a tool like that existed. Going to download now 🙂 This will save me tons of time…
Thanks for the heads up. I learned something in your post. This is the first time I learned that there is something like BrowserShots. Now I will now add this is to my do to list when developing websites. Thanks.
Personally, I like BrowserStack better than BrowserShots – check it out!