Personal Work & Sallee Design

This website is like my baby... I have put so many hours in it. It went through a lot of iterations through the years.

I built my first website with flash and Action Script in 2008. It was really bad. When I started transitioning as a designer I also learned HTML/CSS. I built my second website on Apache trying to fiddle with PHP. That was equaly bad. Then I discovered Wordpress and did a few personal websites with it.

At some point I realized that I didn’t need something as massive as Wordpress for a personal site. That’s when I started building more interesting, hand tailored personal sites. For a few years my personal site was built on static HTML/LESS/jQuery combo.

Sallee Design Today

In 2019 I started eduating myself around javascript frameworks and ended up playing with Vue.js

For a first project, I decided to redesign my static website with reusable Vue components. I was so impressed that I ended up designing and coding a brand new website.

The code base is so easy to move around and flexible that it got easy to update the site.

My website has always been a training ground for me. Mostly for code. It is the main way I educate myself around good and modern HTML and CSS practices.

Live elements made easy

The great thing about Vue is that nothing goes to waste as everything is componentized. If I build a small component for a release, I can always move it somewhere else with another release. All this without having to search through +1k lines of jQuery in a single file.

For example In the previous release, I had an avatar picker on my home screen as an intro. Just a way to showcase some interface design and code in one screen. You can now try here:

Try me

New Branding

I spent much more time than I usually do designing this new release. For my portfolios, I would generally design a few general models and concepts and would start coding early.

But tools like Figma are making it more and more easy to stay on the design tool, prototype concepts, and change components in one place with Design Systems and Styles. This makes for a tigher code integration.

Being an interface designer I don’t get to work too much with brand. It doesn’t mean I enjoy creating one. I always find that these new releases are a great opportunity to practice into it.

Here are a few brand elements I created and used through the site:

Icons

Here is the 2 sets I created for this website.

A retrospective

My first websites were entirely built to share free resources. I learnt photoshop by making free resources that I would share with the community. Free icons, wallpapers or coded journals and skins. This was the winamp skins days. Everything was over made and very realistic. Here are a few images I found in the archives!

A mustache story in motion

Once I started having more experience and work to show, I transitioned to more classic portfolio websites. Nevertheless I was always trying to find ways to make my portfolio more engaging and less boring.

For a long time I used a mustache to engage users with my logo and to showcase some UI skills that didn’t have any purpose than just bringing some interaction and delight.

Here are a few evolutions of the stache and home animations through the years.

It’s only in 2018 that I got a chance to work again on my site. I started playing with a cleaner and more streamlined layout. That would give me flexibility into the design of each page.

I played for a little bit with Jade before transitioning to Vue. I took away the mustache, it didn’t make sense anymore and would just use my name instead.

All the releases since then have been a step into the direction you see today, focusing on adding content. I don’t see every release as a complete re-design but rather as a step into the right direction every time...