• Atom icon
  • Sketch icon
  • Framer icon
  • Figma icon
  • InVision icon
  • +1

How To Survive The Digital Design Landscape

Mårten BjörkMårten Björk6 appsUpdated
Copy a direct link to this comment to your clipboard

There is a lot going on in the world of digital design. Suddenly, everyone is talking about the importance of good design and there are more tools than ever to get the job done. Any designer who wants to survive in this fast-paced landscape needs to shut down Photoshop and start updating their toolset. Here is our top list of useful design tools that everyone should be familiar with in the coming year.

Programming

  1. Atom icon
     Like

    Atom is an open-source, Electron icon Electron based text editor with a massive ecosystem of plugins and themes that are easily accessible through a built-in package manager. Being built with Electron, it uses web technology (HTML, CSS, JavaScript and Node.

    Cost / License

    • Free Personal
    • Open Source

    Application type

    Platforms

    • Mac
    • Windows
    • Linux
    • Chrome OS
    • BSD
    • Electron / Atom Shell
    Intro screen
    Command palette
    Choose from scores of community made themes
    +2
    Project view

UI Design

  1. Sketch icon
     Like

    Vector-based Mac tool for digital UI, web, and mobile design, offering prototyping, real-time collaboration, plugins, reusable libraries, cloud sharing, and device preview.

    Cost / License

    • Paid
    • Proprietary

    Application type

    Platforms

    • Mac
    • iPhone
    • iPad
    App icon design
    Working with colors
    Promo page
    +5
    Illustrating in Sketch
    Mårten BjörkMårten Björk’s note

    Sketch is seen by many as the app that reignited the digital design landscape. After years of being stuck with Photoshop and Illustrator, designers finally had a truly great design application for the Mac. Sketch is still one of the best applications for web and app designers. It's fast, beautiful and has many powerful tools.

  2. Framer icon
     Like

    Combines code-based and visual editing for high-fidelity UI prototyping, real-time multiplayer collaboration, reusable components, and developer handoff.

    Cost / License

    • Freemium
    • Proprietary

    Application type

    Platforms

    • Mac
    • Windows
    • Online
    Framer screenshot 1
    Framer screenshot 1
    Framer screenshot 2
    +8
    Layout Stack
    Mårten BjörkMårten Björk’s note

    Ready to make your designs interactive? Framer is the way to go. It's a powerful tool that allows you to create complex prototypes with ease. It requires a tiny bit of programming, but the application makes it easy to learn. Framer has a built-in design mode, but you can also import files from Sketch. If you have any questions about Framer, there is a friendly community on Facebook that is happy to answer questions.

  3. Figma icon
     Like

    Web-based vector graphics editor with desktop apps, focusing on real-time collaboration and version control for UI/UX design.

    Cost / License

    • Freemium
    • Proprietary

    Application type

    Platforms

    • Mac
    • Windows
    • Online
    • Android
    • iPhone
    • Chrome OS
    • Android Tablet
    • iPad
    • Software as a Service (SaaS)
    ,
    ,
    Figma screenshot 2
    +4
    Figma screenshot 3
    Mårten BjörkMårten Björk’s note

    Figma is a new, web based Sketch challenger. Since it's in the cloud, you don't have to worry about versioning documents or sharing specific versions of files. All your designs are always up to date. It also allows you to collaborate with other designers in real time.

Prototyping

  1. InVision icon
     Like

    We believe the screen is the most important place in the world. That’s why we are dedicated to helping you deliver the best possible digital product experience, with our platform and best practices from your peers.

    Cost / License

    • Freemium
    • Proprietary

    Application type

    Platforms

    • Online
    • Android
    • iPhone
    • Android Tablet
    • iPad
    InVision screenshot 1
    InVision screenshot 1
    InVision screenshot 2
    +13
    InVision screenshot 3
    Mårten BjörkMårten Björk’s note

    InVision is a great app for quickly turning your Sketch or Figma designs into clickable prototypes that you can send to clients. It's not as advanced as Framer or Origami Studio, but it makes up for it in speed. In minutes, you can hook up your designs and connect different buttons and pages. Perfect for getting client sign-off quickly.

  2. Origami Studio is a free design tool built by Facebook designers for creating interactive UI prototypes. An elegant, layer-based interface allows designers to repaidly create prototypes with layers, build interactions and then share them with others.

    Cost / License

    • Free
    • Proprietary

    Application type

    Platforms

    • Mac
    • iPhone
    Layer based design
    Reuse components
    Builder interactions
    +1
    Preview live on mobile devices
    Mårten BjörkMårten Björk’s note

    Origami is another prototyping tool from Facebook. It has a drag and drop interface in which you connect different nodes in order to build prototypes. It has a lower learning curve since it doesn't require any programming, but prototypes quickly become complex and when that happens, Framer may be a better choice.

No comments so far, maybe you want to be first?