Yelp Facebook LinkedIn YouTube Twitter Instagram

Noble Blog

Articles on: Adobe XD

Choosing a Web/UI/UX Design App: Sketch, Photoshop, and Adobe XD

When designing digital products such as websites, apps, etc. there are many apps to choose from. Which one is right for you? While some people use Figma, InVision Studio, and others, in this article we’ll focus on what we consider the three industry front-runners: Sketch, Adobe Photoshop, and Adobe XD.

Sketch

While some designers are just now making the switch to Sketch, it’s been around since 2010. Sketch is a Mac only app, which is fine with most designers, but PC users will need to look at Adobe XD or Photoshop.

Sketch is great for UX/UI design. You can design wireframes or finished visual designs, and turn those into clickable prototypes using Sketch’s recently added prototyping tools or InVision’s Craft plugin.

Sketch has very powerful symbols and styles, which enable you to easily create complex design systems that are flexible and manageable across large projects. It also has decent exporting options.

Sketch costs $99 (USD) and you get a year of updates as well as Sketch Cloud. After the first year, you can continue using your last update for as long as you want with no other payments. However, if you want another year of updates and Sketch Cloud, you must renew your license for $69 (USD).

Sketch is a great option for Mac users that want an affordable and powerful design app.

Learn more in our Sketch class.

UX Design  UI Design  Adobe XD

Video Tutorial: Intro to SVG

If you’re not saving your vector graphics (icons, logos, etc) as SVG for use in your webpages, you should be! Instead of using pixel-based PNGs, keep the graphics as their native vectors (so they download faster and can be used at any size). As great as that is, you can even use JavaScript to animate them!

Download the Presentation Slides
Download Demo Files

LEARN MORE:
HTML5 Animation with GreenSock Class (attend in New York City or Live Online)
HTML5 Animation with GreenSock Workbook (eBook or Print)
Web Design Classes (attend in New York City or Live Online)
Web Design Books (eBook or Print)

Web Design  Web Development  JavaScript  Adobe  Adobe XD

Video Tutorial: Designing for Mobile

Learn about designing for mobile websites and apps. In this free class, we’ll cover numerous resources and info.

Want to learn more? Check out the following classes we offer:

Photoshop for Web Design & UI
Sketch in a Day
Adobe XD in a Day
Web Design Certificate
Responsive HTML Email
Mobile & Responsive Web Design

View the Presentation Slides

 

Web Design  Adobe  Photoshop  Adobe XD

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 Experience Design (XD) Training

 

Web Design  Adobe  Photoshop  Adobe XD

Free Tutorial: Intro to Adobe Experience Design (XD)

Adobe Experience Design is a totally new app created specifically for designing websites and apps. You can craft the visuals and turn them into working prototypes all in a single app! Even though it's currently in beta, it’s developing quickly. See how it works and what it can do for your design workflow.

View the Presentation Slides

LEARN MORE:
Adobe XD Class
Adobe XD Book (eBook or Print)

 

Adobe XD