Stacktile

Make your software stack come alive

Stacktile Feel the Stack ad

Feel the Stack

Stacktile helps development teams to understand DevOps tools and techniques easily and put them quickly into practice. Furthermore, their web app allows software companies to provide interactive documentation to their prospective customers to increase conversions.

The company also offers full-stack development services in addition to an open-source website/app monitoring system.

* Stacktile was acquired by another company based in Berlin.

My Role

As the company's Lead and only Designer, I was responsible for:

  • Branding
  • Marketing
  • UX & UI Design
  • Front-End development

Project Deliverable

Team

  • Dr. Dan Levin (CEO)
  • Michael Martinides (Project Manager)
  • Fabian Schaffert (Software Engineer)
  • Amr Osman (Software Engineer)
  • Marco Canini Ph.D. (Technical Advisor)

Tools

  • Sketch app
  • Invision app
  • Adobe Photoshop
  • Adobe Illustrator
  • Html
  • Css
  • jQuery
  • Bootstrap
  • Git
  • Piwik Analytics
  • Hotjar

Making something
out of almost nothing

When I started, they already had a beautiful logo, but only a logo?! I had to define typography and color palette.

What is the developers' color? Black & Green? Ugh! A bold logotype needs a crisp typeface with character and a bunch of fresh colors and patterns with references to their world.

Online style guide

#32b5cd

Background gradient

#6fcbdc

Background gradient

#bad994

Background gradient

#247E8F

Links

#249270

Links:hover

#586772

Text

#9dc66b

Success messages

#f0cc4e

Warnings and infos

#d9534f

Error messages

Stacktile: Visual identity background colors

And a special touch to the UI

Much before MacOS Mojave, depending on the user's local time, the background of the application changes color.

Web App UX & UI

I created a questionnaire and applied it to a group of users. Furthermore, I reviewed the Piwik analytics, implemented and analyzed Hotjar data to refine the user stories, user journeys, and wireframing boards.

During the time I worked there, I did countless iterations like this to fine-tune the UX and UI of the application.

See the APP HTML prototype
Stacktile UI User Flow
Stacktile UI mobile first
Stacktile UI questionary
Stacktile UI wireframes

Not always what we expect happens

For the launch of the web app, we created two landing pages with different designs to test which of them would convert better. I was positive that the version 2 (screenshot attached) would be the winner, though, numbers showed that version 1 related better with the target audience.

Landing page #1

Landing page #2

Stacktile Landing Page

More services, more landing pages

As mentioned before, Stacktile also provides full-stack development services; they also open-sourced the company's website monitoring technology. I designed two landing pages for each of those areas, and A / B tested them using the Convert app.

Go to the website

Stacktile Landing Page

No cookies, no tracking codes.

Designed and coded by Roberto Simões.