Video Tutorial: Secrets to Designing Hi‑Res Web Graphics (Exploring Modern Workflows)

We’ll explain 1x and 2x web graphics, and show you ways to create them quickly and efficiently in Photoshop, Illustrator, Sketch, and XD.

Download the PDF Reference Notes.

LEARN MORE:
Web Design Classes (attend in New York City or Live Online)
Web Design Books (eBook or Print)
Sketch Training
Photoshop for Web & UI Training
Adobe XD Training

If you design web graphics, this event will be invaluable for reasons you may not even realize until you attend. You’ll learn industry-leading tips and tricks many designers are not even aware of!

For today’s modern web, designers must create graphics for low and hi‑resolution (1x and 2x) screens. That creates complex issues we want to clarify for you. We’ll show you the best ways to create these graphics quickly and efficiently in the top design apps: Photoshop, Illustrator, and Sketch.

Here are some of the topics you’ll learn about:

• Understanding 1x versus 2x (low and hi‑res) graphics: How they work and how to most efficiently create them.
• Files exported from apps such as Photoshop, Illustrator, and Sketch are larger than they need to be! Learn how to further reduce the size of graphics by as much as 85% with no loss of quality.
• A simple secret lets you dramatically shrink the file size of hi‑res photos.
• How to preview your designs (in real time) on a smartphone or tablet as you design.
• Real-world, practical recommendations on what pixel size and resolution you should design at (for Photoshop, Illustrator, and Sketch).
• Designing at 1x or 2x affects how developers will turn your designs into code. So you’ll learn important issues that can arise, and how to speak to developers about them.