Moving on from where we left off, we’ll create the remaining site sections: CTA section, About us, Testimonials, Blog section, Contact area and Footer. We’ll also create the responsive media queries and our custom JavaScript. 7. CTA Section This section has a nice background from OnextraPixel, a short paragraph and CTA button. Step 1 – […]
Posts with tag: bootstrap
Photoshop to HTML: The Agency portfolio conversion – Part 1
In the first part of this series, we learned how to design a modern agency portfolio in Photoshop. Now it’s time to convert the Photoshop design to a working HTML5/CSS3 website. We are also going to use a little bit of javascript to filter the portfolio items and add additional functionality to our site. To […]
Filterable portfolio with Shuffle.JS and Bootstrap 3
In this lesson I’ll show you how to build a basic responsive and filterable portfolio powered by Bootstrap 3 and Shuffle.JS. Shuffle.JS is a free alternative to the popular Isotope plugin. Final Result: Download source files View Demo Resources used Bootstrap 3 Shuffle.JS jQuery throttle / debounce pictures from Lorempixel pictures from Lorempicsum 1. Download […]
Create your own Grid System in Photoshop
Grid systems are an important part of the design process. Grids help you better organize the content on the page and balance the design, by designing in proportions with respect to the size of the grid. This will create an uniform look in your designs, allowing you to display the content in a more readable […]