Slack iPhone Redesign Concept

Current Slack UX pain points and how I propose to fix them.

Kevin Lanceplaine
Apr 1, 2018 · 3 min read
Image for post
Image for post

📋 Description of the project

Like most people in the tech industry, I have used Slack in my work on many occasions. But while I always thought that the UX was intuitive on desktop, I felt the iPhone version could be improved. I decided to analyze in detail what could be revised and to propose a redesign concept.


🔬 UX analysis of the current Slack app

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

👨🏻‍💻 Process and work

Low-fidelity mockups

Once I understood the issues I wanted to fix on the Slack UX, I started to do low-fidelity mockups.

Image for post
Image for post
Some of my early drawings

High-fidelity mockups with Sketch 49

Once the low-fidelity mockups were finished, I started working with Sketch. But before I even started sketching the redesign concept, I wanted to reproduce the current Slack iPhone UI. It allowed me to better understand the design of their iOS application and ensure that my proposal would respect Slack’s design.

Image for post
Image for post
I did the original UI for both the “Aubergine” theme and the “Hoth” theme

Once the original UI was reproduced in Sketch, I started my redesign concept. I made sure to use the prototyping feature of Sketch 49 as you can see below. You can also download the file and try it for yourself. I also uploaded the prototype on Sketch Cloud if you want to preview it directly from your browser.

Image for post
Image for post

Versioning with GitHub + Git LFS

I used GitHub (with Git LFS) in order to manage the different iterations of the project.

Image for post
Image for post
GitHub allows me to easily see the changes for each commit I made

💎 Outcome: Redesign concept

You’ll find the most important screens below along with some explanations:

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post

▶️ Preview the prototype

You can preview the prototype directly from your browser thanks to Sketch Cloud: sketch.cloud/s/5n99y

⬇️ Download the file

You can download the Sketch file on sketchappsources.com.

It contains:

  • 15 artboards of the original Slack UI as of March 2018
  • 14 artboards of the redesign concept
Image for post
Image for post

Feel free to comment below if you have any feedback!

Thanks for reading 😊

Design + Sketch

The best collection of articles, tips, tutorials, and…

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store