how to use the 7 programs in this toolkit – WAU

Adobe Edge Suite is a complete package of solutions aimed at developers. With this selection of 7 softwares it is possible to work on high level web applications, especially for mobile.

In their daily lives, developers need tools that offer support for their work. Adobe Edge brings together a series of solutions that help from application testing, to developing animations and other features for web pages.

The idea is that this software package meets all the needs that involve development work.

The package consists of 7 programs, some more decisive and relevant, others more focused on support for specific tasks that vary from one project to another. In order to understand how each of these software can help, it is essential to better detail how they work and what gains can be obtained.

In this post we will show you more about how Adobe Edge Suite works, what your proposal is and how it can help the developer.

Also check out how the 7 programs in the package work!

Better understand what is and what the proposal of Adobe Edge Suite

Widely known in the market, Adobe is a company that has always had innovation as the basis for its products. Its solutions have always helped professional segments, such as creative ones, as well as supporting more basic tasks, from flash to PDF readers.

Edge is the product of this posture of delivering tools to support activities, in this case, developers.

In practice, when we talk about software, a suite is a kind of central solution composed of different programs aimed at a purpose. It is a set of tools that form a complete package of support for a professional activity.

Adobe Edge Suite was developed thinking about all the needs that the developer has when working on an application.

The big difference of Adobe’s proposals in a suite is to think of tools that go beyond the most basic and initial work. The solutions are able to provide the support that the professional needs to insert more advanced features and resources when developing something for the web.

In addition, the solutions are aimed at supporting development with the latest standards in this segment.

Discover each of the 7 solutions in the package

Adobe Edge consists of 7 applications: Animate, Code, Inspect, Reflow, Web Fonts, Typekit and Phonegap Build. Each of them supports different phases and needs of the developer’s work, forming a complete package of indispensable solutions.

Next, find out in detail how each of these software works and what they deliver in value.

Cheer up

Adobe Animate was Adobe’s answer to the end of Flash, after it was rejected by iOS and OSX systems. Today, Animate fulfills the role of its ancestor, allowing the development of interactive applications and animations on HTML pages.

The developer manages to develop these applications in a very editor with a very common interface, using a timeline, just like audiovisual software.

All work is divided into frames, which facilitates the programming of animations and movements. The tool’s environment is also very familiar, with an aesthetic very similar to the CC package software.

The range of effects offered by Animate makes the software even more interesting and enriching for projects of all types. The main gain it offers is the development of applications for any platform, thanks to Webkit

The content created runs normally on any iOS and Android system, with full responsibility, and is also compatible with all web browsers on the market.


Code, as the name suggests, is the Adobe Edge Suite solution aimed at developing and editing programming codes. As this work requires, the software has a very simplified interface that helps the developer to focus on its lines and avoid any type of error as much as possible.

Open source, the tool supports widely used programming languages, such as CSS, JS and HTML 5, doing all of this work in a fully integrated way with the Creative Cloud package, Adobe suite focused on design and graphic production.

The advantage of this is simple: integrate layouts created for the web with codes, making front-end and back-end construction much easier.

The focus of the Code is to make life easier for the professional developer, and this is demonstrated by the accessible and very practical functions, such as the dynamic visualization of the code.

Thus, any error can be quickly corrected. This function also shows the result of the development in real time, supporting the continuity of the developer.


Another Adobe Edge Suite application that updates an old application: Inspect is the new generation of Adobe Shadow. The purpose of this tool is to inspect pages, allowing the developer to view the code being changed while accessing the site.

From this he can make strategic observations that can awaken perceptions about possible changes.

The main highlight of this tool is the integration with mobile. It works in a simple way: the developer is able to pair a smartphone with Inspect installed on the computer and, from there, every page he opens on his phone will replicate the code to the desktop.

This function has the proposal to allow the observation of the behavior of pages in mobile formats, but replicating all this activity to the desktop, facilitating any changes.

The gain that this provides is always working with responsive applications that work well on mobile platforms.

The Inspect work interface is fully customizable. This helps to create a dashboard geared to the user’s needs, optimizing accessibility the way he prefers!

You may be interested in these other content about the Adobe package!
Adobe Indesign: step by step how to use the tool
Adobe Lightroom: learn how to use and apply presets
How to create an online portfolio with Adobe Behance
5 graphic design programs for beginners: meet the best!


Reflow is another software that Adobe developed to facilitate the work of developers with page layouts. Not everyone has expertise in front-end design, and Reflow is just the tool designed so that this is not hard and exhausting work.

More than just a web page, the proposal is to provide the ideal support for it to be fully responsive. Today, mobile access is a very concrete reality, which requires that any project be designed for access through smartphones and tablets.

The work performed at Reflow is complete: backgrounds, images, color palette and everything else related to the design of the pages. Both the structure of the layout of the elements and their aesthetics can be edited in a simple way, in a lean and simple to understand interface.

The layout can be changed completely, in a high-level job and can be done entirely in CSS.

Web Fonts

What would a web project be without a good source? Each concept calls for a different font style and one of the biggest problems that the developer faces is precisely not having access to a free bank.

Web Fonts has exactly this function of offering a list of alternatives for any application. Inserting these fonts in your project becomes much simpler with the use of the tool. It does not require installation or other more complex configuration.

Just choose the preferred style, type the desired text and Web Fonts offers HTML and CSS codes to be inserted in the development of the application.

The tool can be accessed from the browser the professional uses, without the need for installation. Its interface is very lean and simple, focusing only on choosing the font style and displaying the code related to it.


Typekit is not far from Web Fonts. In fact, it is that offers the font base used by Adobe solutions including Web Fonts itself. What stands out in this tool is that it is integrated with Adobe’s Creative Cloud, that is, the community of professionals in the field of development and design.

This allows Typekit to have its source base updated constantly, thanks to the offer of new jobs that creative professionals share in the community.

Just find out about the rights to use the font and understand if it can be freely applied to any project.

Phonegap Build

The present and the future are mobile friendly, and Adobe wasted no time in understanding this and offering software that allows the development of applications for this model.

Phonegap Build proposes to offer a platform for developers to work on projects for mobile platforms.

The applications are made in an interface that is also very practical, intuitive and very agile and simple to operate. The focus is directed to projects in HTML, CSS and JS, very traditional languages ​​and which are in high demand by professionals in the segment.

Phonegap Build has very complete functionalities for the development of the project. It also supports teamwork, allowing invitations to be sent and hierarchical division to other users who will work on the application.

Complete, Adobe Edge is the developer dream package. With these 7 software options, work is more practical and with support for different types of projects. The idea is that this suite is a real toolbox in the daily life of professionals in the field.

Did you like to know about this subject? Adobe has efficient solutions that add a lot to the market. Now we have a suggestion for another brand software: learn how to use Photoshop!