Is it possible to use legacy software like Adobe Photoshop and Illustrator for UI Design?

That’s that question we’ll try to answer in this blog.

In UI design, we’ll use Photoshop and Illustrator in parallel.

There are three stages in UI design workflow:

1. UI Design
2. Prototyping
3. Design handoff

We’ll explore how Photoshop and Illustrator are usable in each of these three stages.

UI Design

Photoshop and Illustrator are great tools for creating UI designs. Both tools are capable of creating high-quality, vector-based graphics like icons, and both have features that aid in UI design workflows. There are plenty of websites online that let you download SVG and modify as you wish.

The first step in UI design is layout design. You can do layout design in both Photoshop and Illustrator. The next step is designing icons. If you’re doing UI design in Photoshop, you’ll need to switch over to Illustrator to design the icons.

So. you’ll need to have both the applications open in your computer. For this, you’ll require a computer with high-end specifications for memory and hand-disk storage.

These are the disadvantages of choosing the Photoshop/Illustrator combo for UI designing.

With the availability of plenty of cloud-based tools, it’s no more required to have a high-power computer.

There’s another advantage. Let’s say you’re designing an entire flow on a UI design tool. You can place all screens next to each other and create them. It makes it easy to design your flow. You don’t need to manually transfer from one app to another.

You can’t visualize all screens in a single page in Adobe Photoshop. Here, you’ll have to create separate layers for all screens and toggle them on/off to show or hide them from the view.

In Illustrator, you can place multiple art boards in a single page. Because of this convenience, you can do the UI design in Illustrator.

Prototyping

 

Let’s now understand how convenient are Photoshop and Illustrator when it comes to prototyping.

InVision is a prototyping that supports Photoshop files. To use InVision, simply create an account and export your PSD files to the platform. You can do advanced level of prototyping with Photoshop and Invision.

However, InVision doesn’t support Illustrator. Therefore, prototyping your files designed in Illustrator is a slightly roundabout process. First, you have to export your design files separately in PNG format and then import them into InVision.

So, if Photoshop is your design tool of choice and need to make changes, all you need to do is export the files and it will automatically sync to InVision. No additional steps are required.

That is not the case with Illustrator. You are required to made the required changes, export them as PNG, reimport into InVision and then again do the prototyping. This is a tedious process.

So, prototyping is easier if the design with Photoshop; it’s a bit hard if you design in Illustrator.

Design Handoff

 

How flexible are Photoshop and Illustrator when it comes to design handoff? Let’s explore it.

Zeplin, the leading design handoff platform, offers a plugin for Photoshop, using which you can easily do the design handoff. There is no similar feature for Illustrator.

If you use Illustrator as your sole design tool, you’ll have to prepare a hand-off file with all the details. Besides, you’ll have to put all the design files in a zip archive and send it over to your developer.

The next tool of design handoff is Avocode, which supports both Photoshop and Illustrator. While Avocode supports both Photoshop and Illustrator, the developer community prefers Zeplin’s ease of use.

Conclusion

You can use both Photoshop and Illustrator for UI design.

For prototyping, since InVision supports only Photoshop, Illustrator is at a slight disadvantage here.

For design handoff, Zeplin supports only Photoshop. Even though Avocode supports both Photoshop and Illustrator, since it doesn’t have a wide acceptance among the developer community as much as Zeplin.

So, here’s my verdict. If you are comfortable using Photoshop, then yes, you can definitely use Photoshop for UI design. But, I would recommend using a dedicated UI design tool. You can learn them in just 5-6 hours.

If you already proficient in other design tools like Photoshop or Illustrator, you’ll be up to speed in less than 30 minutes.

I recommend not to get stuck in Photoshop and Illustrator, and shift to a modern UI design tool.

Can I use legacy software for UI design?