As marketing campaigns become more personalized, designers have the opportunity to have a big influence on the quality of the message.
Mode’s marketing team is pushing the boundaries of what it means to deliver a compelling message that provides value to our audience. As part of a recent initiative, the design team explored how we could create interesting visuals that the sales team would attach to emails sent to potential customers. The challenge was: how could we scale the process to thousands of assets, without any engineering resources, and in less than a week?
Here is a sample of what…
In this series, we would like to share our adventures finding the right tool to do better design research. TL;DR: We found what we were looking for with Eagle. We will also share how we are using this amazing tool in the second and third parts.
Our team has been growing rapidly in the last year. We have now 5 UX Designers in our team. This brings new opportunities, but also new challenges for our design process. One of the aspects we focused on was the design research phase.
So far, whenever we needed to design a new app from…
In Part 1, we talked about why Eagle is our favorite tool for design research.
In this post, we will share more about how to set up the tool, and use it, as well as some learnings we gathered along the way.
Before starting, watch the video demo to get a peek at the sleek features this tool has to offer. We’ll go through the basics in this article, and all of the advanced tools in Part 3.
First things first: download Eagle for your Mac or Windows.
Open the app and create a new library. Select a…
In the previous articles, we shared why Eagle was a great tool for our design research, and how we use it. In this part, we will focus on more tips and tricks our team often uses.
I recently had to work on some map charts. And one of them was about showing some key metrics for major cities in the US. After a quick search, the team couldn’t find one that fit our needs. So we looked for a way to design our own in sketch and export it as an SVG to be used in HighMaps.
All the files used in this tutorial are in this Dropbox folder.
If you want to know more about HighMaps, check the introduction for Designers post I wrote.
In our case, we just started from a generic US map…
Wouldn’t it be great if instead of dummy text you have real-like text that brings life to your designs? Wouldn’t it be easier for stakeholders to understand what information goes where? Would it even make sense to show dummy text during user testing?
Mockaroo is a very simple, yet extensive random data generator. The tool allows you to generate thousands of rows of data with over 100 field types to choose from. We’ll get to the details in a sec, but I just want you to be as excited as I was when I first heard about it.
Having heavily worked on Analytics products for the past year, I realized a few months back that my own understanding, as well as my team, of how charts work was still a bit blurry. So I decided to dig into the matter and learn more about Highcharts, the framework we are using to power all our data visualizations.
Designing an analytics product is not an easy task. What data should be surfaced? How do you convey its meaning in a useful way? What can actually be built by your developers?
It all started when I used for the first time the Beta version of Prototype, a Sketch plugin by InVision. I was amazed by the ability to embed a phone feature, such as the camera, in the flow of my prototype.
However, I couldn’t find any Sketch resources of the official Camera app by Apple for the last version of its iOS (10). So that’s when I decided to make my own. The goal was three-fold:
I’ve seen myself having to create a simple spinner icon a few times lately. And every time, I have to remind myself how to do it, because I don’t use often the techniques needed. So I decided to write a short tutorial, to remember it once and for all. And to, hopefully help other designers to avoid the same frustration.
It’s actually pretty simple, you just have to know the right commands. Here are the 3 steps:
The first thing to do is to create any shape you’d like in an artboard.
Select your shape, and go to “Layer >…
Let me show you how to improve drastically your workflow by creating your own API that can be used with Craft Data plugin, with no coding required at all.
By the way, API stands for Application Program Interface. It makes the communication possible between softwares. Your database and Sketch in this case.
The API will allow you to get the information from your Google Spreadsheet in your Sketch file super easily.
The only tools you need are:
Make sure to do the followings before starting:
Pushing the boundaries of user experience.