Filipe Fernandes is a UI Designer & Developer based in Dublin, Ireland

I help companies to build end-to-end digital products with great user experience.

Featured work

AnPost Money

As member of the Frontend team at the award winning design agency AllHuman, I had the privilege to work on the website’s rebrand for the main provider of postal services in the Republic of Ireland An Post.

My role was mainly focused on developing the new components used on their new service page, An Post Money. The Agile methodology was part of our workflow with constant deliveries at the end of each sprint.

Over the course of this project a living Design System came to life along with a Style Guide, as a result of really close work between designers and developers.

Live project →
  • Sketch
  • Atomic Design
  • Design System
  • HTML
  • CSS
  • JavaScript
  • Sass
  • Grunt
  • Responsive Web Design
  • Agile
  • Scrum
AnPost Money

Choco la Design

I founded Choco la Design in January 2010 with Willian Matiola. Since 2014, when Willian left, that Choco la Design is no longer collaborative and has become my personal blog where I talk about design, development and to share my professional experiences and opinions.

Over the past 8 years I have been doing content management such as post scheduling and content curation, as well as managing over 60 people who contributed with guest posts daily. At the same time, I managed to design and develop a few versions of the webstie built with Wordpress but now I have moved to Jekyll.

Having a personal project for so long has reflected directly in my career and vice-versa. As a result, in 2018 I had to sync my professional interests with Choco’s by focusing the content on User Interface, User Experience and Interaction Design, as well as Frontend technologies such as HTML, CSS and JavaScript.

Live project →
  • Adobe Xd
  • Zeplin
  • Design System
  • Mobile First
  • Responsive Web Design
  • HTML
  • CSS
  • JavaScript
  • Sass
  • Jekyll
  • PWA
Choco la Design

Fleetman

I was invited from UI Lab to work on the Frontend and Interaction Design for one of their clients, Fleetman, which is a freight service company that collects and delivers customer’s packages.

The project was developed using React in order to make it easy to integrate with the client’s backend platform using RESTful API.

Live project →
  • Sketch
  • Zeplin
  • HTML
  • CSS
  • JavaScript
  • Sass
  • React
  • Webpack
  • Mobile First
  • Responsive Web Design
Fleetman

My process

I have been working with design and development since 2005 and I was able to go from Information Architecture, to Visual Design and Frontend Development, specialising myself in User Interface and Interaction Design. This broad technical background has given me a sharp perspective in finding the right tools for building user-centered digital products.

Over the the course of my career I developed my own design process. I split it into four steps: Discover, Structure, Build and Refine. However, this is not a linear process; things can happen randomly or even backwards as the project moves along. At the end of the day, the goal is to reach the desired outcome for the project.

Discover

This is the most essential; and yet most difficult part. Getting the information from all over the place is challenging, that said it's when we learn the most about the project.

In other words, the discovery phase is a deep learning process that we can break it down into:

  • Get to know the people: Who is involved in the project? What are their roles?
  • Get to know the product: Why and what does it do? What does it look like?
  • Map the journey: What is current flow of people? How do they go through services, products or website?
  • Find out the pain points: What are the problematic or difficult parts of the current solution?
  • Identify motivators: How do we give the user that shot of dopamine to keep them interested?

Structure

After gathering as much information as possible, it's time to put it all together and define the project's structure.

We will now synthesise, sort and organise all the information we have in order to shape the outcome that we are looking for. By doing that we will have a better understanding about major parts of the content and it’s structure. As part of this phase, I generally include:

  • Data analysis: What data do we have? What data do we need?
  • Define personas: Who are the users/customers? What are their needs?
  • Get technical requirements: What are the constraints? What tools and techs do we need?
  • Define use cases: What actions are expected? What goals are supposed to be achieved?
  • Write user stories: How do we describe the user perspective? What features need to be added?

Build

This is definitely my favourite part! Now it's time to get all the makers together and craft something amazing.

Every time I am about to build something, after all the notes taken and analysed, I like to choose everything I think is necessary to bringht the project in to reality. That said, I keep a couple of mothods, mental models, tools and technologies in my arsenal to help me and my team to make it all happen.

  • Design: Sketch, Zeplin, InVision, Adobe Xd, Illustrator, Photoshop.
  • Development: Git, Vim, Sublime, Webpack, Gulp, MacOS.
  • Technologies: HTML, CSS, Javascript, Sass, React, Jekyll, Wordpress.
  • Methodologies: Atomic Design, Design Sprint, Lean UX.

Refine

Refinement is not an actual phase, but rather a constant that happens intrinsically as I go through each step of my design process.

While the discovery, structure and building processes are happening the we don’t even notice how much knowledge about the project we have, which means that we spent less and less time learning and more time doing.

So, essentially, the refinement is always happening. Whether building a brand new product, doing a redesign or even just implementing a new feature. What I love the most about refinement is that, we always carry that knowledge with us.

Tell us about yourself

I have been working in design and development since 2005 and over the last 10 years I was able to go from Information Architecture, to Visual Design and Frontend Development, specialising myself in User Interface and Interaction Design.

In 2010 I founded Choco la Design, a community-driven website where I share my experience in order to help designers and developers work better together and deliver great digital products.

Throughout my career I have had the opportunity to work with companies like Brazil's Ministry of Health and Supreme Court, Bank of Ireland, AnPost and AA Insurance.

Filipe Fernandes – UI Designer & Developer based in Dublin, Ireland

Skills

Information Architecture

I have a strong knowledge in organising and categorising content in a way that allows the user to complete tasks and goals in a more effective way. As well as reducing cognitive load and distractions so users can have a much more focused experience. I also have some experience with wireframing and site maps.

User Interface Design

I have a large knowledge on designing neat and effective user interfaces as it is the core of my working experience. I also have a keen eye for things like web typography, colour theory, responsive web design, and iOS and Android human interface guidelines.

User Interaction Design

Over the last 5 years I focused on developing my technical skills by working mainly as a Frontend Developer. During this time, I have built tons of scalable and reusable User Interfaces using HTML, CSS and JavaScript along with Sass, React and Webpack.

User Experience Design

Over the course of my career I was able to develop a holistic way to look at the User Experience after building several user-centered digital products end-to-end. Generally I do Heuristic Evaluations, Sketching and Usability Testing as the project moves along.

Did you enjoy? Hire me!