Building Modern Navigation Designs in Photoshop and HTML
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.
What you'll learn
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.
Table of contents
- Designing the Desktop Mockup 6m
- Revising the Mockup for Mobile 6m
- Designing the Navigation Drawer 7m
- Writing the HTML 7m
- Styling the Project with CSS 5m
- Finishing the First Project 9m
- Designing an Email Icon 10m
- Finishing the Icon Designs 9m
- Mocking up Vertical Navigation 9m
- Finishing the Mockup Design 9m
- Exporting the Assets 6m
- Writing More of the HTML 5m
- Writing the CSS 10m
- Finishing the CSS and Beginning the JavaScript 5m
- Finalizing the JavaScript 9m
