Raffaele Gesulfo

Python & SQL Tutorials

Mode │ Lead Product Design │ 2018 - 2019

One of my first projects at Mode was a total revamp of its Python and SQL tutorials. They are some of the best resources out there for data scientists and anyone wanting to be better at data analysis. In addition, they were a huge help for Mode since its beginning, to gain visibility and credibility among its audience. Needless to say that these tutorials are a big part of Mode’s identity. So making major changes to modernize and improve them required a lot of collaboration up to the executive team and the CEO himself (who actually wrote them years ago).

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. The information in this case study is my own and does not necessarily reflect the views of Mode.

Defining a new style

With just an emerging new branding coming from the marketing team, my first task was to define colors, typography, and layouts for over 60 existing pages with a lot of different content types. Another challenge was the aggressive timeline and the lack of engineering resources. I decided to keep the design clean to be flexible and quick to build. I also focused on the mobile experience for people learning on the go.

Getting approvals

Another big step was to get approval from many different stakeholders regularly along the process to keep them on board with the new direction. That part was the trickiest and didn't always go well as communication would sometimes break down between teams. I made sure all my latest designs were accessible for everyone at any time to avoid time-wasting confusions.

Time for action

After many quick iterations, it was already time to implement the designs. Once we got the engineering leadership approval, I joined the team to implement the styling aspect of the project, as well as guiding the design system efforts in parallel. Something I find very useful is to break down the design styles into easy to digest and copy-paste CSS for engineers to fully understand the intent of each design decision.