Web Design Series

Collections of posts that take you through a particular topic or project.
  • Macaw thumb

    Macaw has been eagerly awaited since its Kickstarter campaign reached full funding back in November 2013. Pitched as the application which allows you to "stop writing code and start drawing it" Macaw promises to bring web design tools right up to date. Follow Adi Purdila as he introduces Macaw, examines its features and interface, then uses it to design and build a complete responsive website.

    View Series…
  • Timeline portfolio series

    During this series you'll be using Photoshop CS6 to design a simple, clean, three-column portfolio page, with a trending timeline. Once done, you'll move over to a code editor and begin building your finished page for the web. Along the way, you'll learn about the designer > developer workflow, whilst using tools such as Sass and jQuery.

    View Series…
  • Shopify series

    Over the course of three articles here on Tuts+ we'll be looking at how to build a theme for the hosted ecommerce platform Shopify. Follow Shopify Designer Advocate Keir Whitaker, as he demonstrates all the skills you’ll need to get started, as well as showing you a number of creative ways to make your themes flexible and powerful.

    View Series…
  • Email session retina

    The subject of HTML Email can make even the most seasoned web designers' palms clammy; it's a minefield of hacks, pitfalls — and means disregarding all the things we've learned about web standards during the past decade.

    This series of tutorials will take you through the fundamentals, exploring development techniques, workflow and design approaches. By the end, you'll have gained enough knowledge and confidence to tackle HTML email properly.

    Hat tip to Pierre Borodin for the Fresh flat icons.

    View Series…
  • Gumby session retina

    The Gumby Framework offers rapid and flexible front-end development. Its features include installation and maintenance tools, Sass support, a semantic grid, toggles and switches, parallax toys and much more. During this series we're going to walk through those features and tools, before building ourselves a complete Gumby website.

    View Series…
  • Tumblr session retina

    Tumblr is home to over 140 million blogs, making it one of the most successful blogging platforms around. Having recently been acquired by Yahoo! it's now firmly set to be one to watch in 2014, and that's great news for Tumblr theme developers!

    In this screencast tutorial series we're going to walk through the complete process of developing a responsive Tumblr theme, called "Peter". We'll dive into the code structure, theming options and I'll throw in lots of tips I've gathered as a Tumblr theme developer along the way. Source files will be made available as they're needed, so, if you're ready, let's begin!

    Useful Links

    View Series…