I've been studying a lot about web accessibility lately, and I noticed that one of the aspects that's often overlooked is color contrast. It’s particularly hard to prevent contrast issues in apps that allow the user to select the color scheme.

Many times, I’ve been in situations where there were real tugs-of-war between designers and accessibility experts. One side pushing for high contrast and the other pushing for beauty.

This got me thinking: there has to be a win-win solution


When I came across this Codepen that shows an amazing animation of a Star Wars AT-AT Walker that was built ENTIRELY with CSS…

I was like:


"Usabilidade" é uma palavra mágica, responsável por fazer com que as pessoas que acessam o seu site não odeiem você. Separamos três artigos, com ótimas dicas, para te ajudar a entender os principais conceitos sobre o tema:

Design e consistência e minha mãe

Me formei em uma faculdade de design gráfico voltada em formar profissionais para a publicidade e impressos. O curso foi pensado para atender o mercado de Salvador, cidade em que eu vivo. O reflexo disso é que a grande maioria de meus ex-colegas de classe trabalharam ou trabalham em agências de marketing e publicidade. Inclusive …

Leia mais

Por que fazer testes com o usuário?

Exercitar a empatia sempre…


I have been a bit obsessed with SVGs and CSS animations lately, so I thought it could be a good idea to share my latest finding with you guys. The idea of this article is walk you through some basic concepts that will allow you to create cool animations like this one, with SVGs and CSS.

Ok, but what is an SVG?

SVG stands for Scalable Vector Graphics, It's an image format that you can write yourself using a text editor or use programs like Illustrator or Sketch to create more complex drawings.


Part 1 — Creating 3D objects

Recently I've had the opportunity to work in an awesome project at HE:labs. It was an interactive isometric map where each building represented a project and on mouse over we displayed a short looping animation as a preview of what that project was about. I got some really good feedback for this app and the client was really happy with it, so I felt like it could be a good opportunity to explain a really simple approach for creating 3D images and animations for apps using Maya.

If you never ever opened Maya, the interface can be a bit scary…


One of the things that I found the hardest when I started working with design was finding the right colors for the project. I actually thought that I didn’t have the talent or sensitivity needed to create a decent color palette.

One of my instructors at school once told me to “steal” other people’s palette using the Photoshop color picker because it would be easier and faster than creating my own from scratch.

Krystal Campioni

Senior Front-end developer @ Shopify. Giphy and Whale fluent speaker. Tech, design, and marine life enthusiast | www.krystalcampioni.com

Get the Medium app

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