Join Justin Seeley for an in-depth discussion in this video Using Edge Reflow to test responsive designs, part of Photoshop CC for Web Design.
- View Offline
- Exercise Files
…I mentioned earlier in this course when we were talking about responsive design…that there are many different ways to…build responsive designs, is out of Photoshop.…One of which includes, just creating a…different document for each different screen size.…But, as modern web design work flows evolve, people are going to be…looking for better opportunities to test…responsive designs using tools like Photoshop.…And so, Adobe recognizes this and they've added in…a new tool set to Photoshop called Edge Reflow.…Now, Edge Reflow is its own standalone product by Adobe, which is built in…order to help you sort of get a jump start to creating responsive designs.…
But now there's a plug-in through Adobe Generator, which actually allows…you to generate Edge Reflow projects directly through Photoshop, as well.…So all you have to do, is go through your document and as we did before, start…naming things like logo.png or you know, AlexMorales.jpeg.…Just name things the way you would any…other Adobe Generator export that you're trying to do.…
- Why use Photoshop for web design?
- Decoding the mysteries behind screen size and resolution
- Giving your website a purpose with a content strategy
- Customizing a web workspace in Photoshop
- Designing responsively
- Creating wireframes on a grid
- Choosing colors and fonts
- Developing a UI kit with Photoshop
- Assembling a page mockup
- Creating image sprites
- Optimizing images
- Integrating with the rest of the Adobe Creative Cloud
Skill Level Intermediate
1. Core Concepts
Understanding the "new web"2m 39s
2. Setting Up Photoshop for Web Work
3. Designing Responsively
What is responsive design?5m 26s
4. Creating a Wireframe
5. Creating Aesthetic Elements
6. Creating a UI Kit with Photoshop
7. Assembling a Page Mockup
8. Optimizing Web Graphics
9. Creating Image Sprites
10. Using Other Apps in Your Workflow
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.