Building Modern Navigation Designs in Photoshop and HTML
Pluralsight
Course Summary
In this Photoshop and HTML course, we'll create two full projects to illustrate the power of modern navigations. Software required: Adobe Photoshop CC 2015, Sublime Text 2, Adobe Illustrator CC 2015.
-
+
Course Description
In this Photoshop and HTML course, we'll create two full projects to illustrate the power of modern navigations. With our first project, we'll tackle the design and integration of a modern navigation for a responsive website. Then, we'll move onto our second project where we'll build a scrolling, one-page navigation. Along the way, you'll learn tips for doing quick mockups in Photoshop and writing the HTML, CSS, and jQuery code necessary for building navigations. By the end of this Photoshop and HTML training, you'll have a solid understanding of designing and implementing modern navigation techniques. Software required: Adobe Photoshop CC 2015, Sublime Text 2, Adobe Illustrator CC 2015.
-
+
Course Syllabus
Introduction and Project Overview- 1m 3s
—Introduction and Project Overview 1m 3sBuilding Modern Navigation Designs in Photoshop and HTML- 1h 52m
—Designing the Desktop Mockup 6m 26s
—Revising the Mockup for Mobile 6m 11s
—Designing the Navigation Drawer 6m 40s
—Writing the HTML 6m 53s
—Styling the Project with CSS 4m 36s
—Finishing the First Project 8m 40s
—Designing an Email Icon 9m 49s
—Finishing the Icon Designs 8m 35s
—Mocking up Vertical Navigation 9m 13s
—Finishing the Mockup Design 8m 53s
—Exporting the Assets 6m 11s
—Writing More of the HTML 4m 58s
—Writing the CSS 10m 21s
—Finishing the CSS and Beginning the JavaScript 5m 19s
—Finalizing the JavaScript 9m 7s
