Site Elements

A Smarter Twitter Page in Under 15 Minutes


Today we'll design a smart, vintage modern background to welcome visitors to your Twitter page. We'll go over some layout considerations, then dive into Photoshop. Have fifteen minutes spare? Let's go then!

The Screencast

Yes, the video's eighteen minutes long, but the time spent designing in Photoshop is much less..!

Alternatively Download the video, or subscribe to the Webdesigntuts+ YouTube channel!

Additional Resources

It's worth mentioning a couple of resources used when making this Twitter background:

Related Posts
  • Design & Illustration
    Interview With Mobile Interface Designer, Alan PowerPreview
    A chat about designing mobile interfaces with Alan Power.Read More…
  • Web Design
    A Quick Q&A With Jason PamentalJason thumb
    Jason Pamental has been working the web for a long time; so long in fact, he's even used something called "Netscape". This experience, coupled with his passion for responsive design and web typography (amongst many other things) have made him a familiar face on the speaking circuit. I caught up with him, shortly before he heads to London for the Future of Web Design, and fired a few questions his way.Read More…
  • Web Design
    Building the Merry Christmas Web App InterfaceXmas build 2 retina
    Today we're going to build the Merry Christmas Web App Interface; a Photoshop layout from an earlier tutorial by Tomas Laurinavicius.Read More…
  • Web Design
    Designing a Merry Christmas Web App InterfaceXmas website retina
    In this tutorial I'll walk you through the process of creating a simple, festive interface for a web app in Photoshop CC. The concept behind the app is that users can connect with Twitter and write a Christmas wish on a public board, effectively creating a huge Christmas postcard. We'll look at styling typography, combining a flat color palette and achieving a clean and roomy composition.Read More…
  • 3D & Motion Graphics
    Motion Graphics
    Selective Shadows Using Photoshop to After EffectsAetuts retina selective shadows
    In this tutorial, we'll combine Photoshop and After Effects to create this shadow-styled animation. Using a non-destructive workflow, we'll create the design in Photoshop and import it into After Effects to bring it to life. We can easily go back to Photoshop if we want to change it later.Read More…
  • Web Design
    New to Web Design? Start Here.New to web design
    Welcome to Webdesigntuts+, an online resource dedicated to teaching and encouraging web designers of all skill levels and experience. Whether this is your first time here, you've found yourself dipping into our content in the past, or you're a regular visitor, this post will help you find the best of our content.Read More…