main image Connekti


Building stronger communities

Connekti is a prototype for an app that would help users to really connect with people who live nearby. By asking for or offering help and receiving points that convert to discounts in local shops, Connekti would make communities in Vancouver closer.


grad project (VFS) - 2013

What I did:

  • Research and persona development
  • Wireframes
  • Moodboards/Style Tile
  • UI design
  • Interactive Prototype (html/css/javascript - built using PhoneGap)
image connekti hand device


After I had the initial idea of Connekti the next question that came into my mind was “is there a need for this service?”. A lot of my research suggested that people perceived Vancouver as a “cold” city in terms or personal relationships and community engagement. This suggested to me that Connekti had potential for success.

I also did an online survey to comprehend how my target audience think and what kind of favours they would accept from their neighbours. The online research brought many questions to light, which gave me ideas for introducing some features in the system to accommodate real issues raised by potential users.

“Well, that's not really a neighbour anymore. It's a member of the community, but too far.”

Answer from a respondent when asked if they would walk 30 min to help a neighbour

The next step was to create personas and to do an exercise called “a day in the life”. This allowed me to put myself in the users’ shoes and imagine the scenarios in which the app could be used. This was invaluable in developing a customer centric experience.

It was then time to put the concept to test with real users to validate (or disprove) my assumptions. After sketching some wireframes I made a digital version of them and did a prototype. I recorded the users using the app and took notes. Their verbal inputs and actions helped me to iterate on the next set of wireframes.

connekti personas
connekti wireframes

After the structure was completed I needed to work on the feeling of the brand. The experience is not made only through the structure but also through the visuals and the emotions that they evoke. I started with a moodboard and also created a style tile.

The last part was to put it all together in a polished functional prototype. With html, css and javascript my prototype now had a life of its own and it felt real. My goal was accomplished.

connekti style tile


The project won the VFS student award Best User Experience Design, voted by my peers and industry professionals. Also during my graduate night presentation, many prospective employers came to talk to me about how impressed they were when they learned I finish this prototype in approximately 10 weeks.

Video Demo

connekti final results

main image YouTube

YouTube Integration

Bring video into your social media family

Hootsuite had a shiny new integration with YouTube. To communicate this the Brand team did a campaign with the concept “Bring video into your social media family” and I was responsible for designing it's webpages.


Hootsuite - 2016

What I did:

  • UI design
  • UX design


One of the challenges of this project was to reuse components that exist on the other pages of our website. This webpage really needed to stand out from our other pages since this was a major release. My solution for this challenge was to work with new approaches to imagery in order to differentiate this page from the others we usually have.

I started mapping the user journey to have a clear idea of the path the users would take to interact with the pages

page sructure

From this journey I realized that the campaign’s main picture should be in the main landing page only. From there on there wouldn’t be a need to show the campaign’s feeling through imagery since the deeper pages were more technical and informative. In the technical pages I chose to use only a background texture since the focus of the page was the messaging regarding new features.

For the texture I took a look at some interesting patterns and also went into each one of the platforms to see which icons/symbols were appropriate for each section.

In the technical pages I wanted the design reinforce the copy, making the content easy to digest for our users. That is why I decided to use a close up of screenshots to really reinforce the benefits the copy was talking about, giving a clean and modern look to the page.

you tube images
You Tube integration final

main image Mobile Experiment

Mobile Experiment

Motivating users to install our app

Mobile users can access Hootsuite's dashboard using their browser. However the experience and functionality are not as complete as the app experience. Thinking about that, the Online Revenue team decided to do an experiment in order to increase app installs for iPhone users.


Hootsuite - 2015

What I did:

  • Analyzed current user flow
  • Analyzed industry standards
  • UI design
  • UX design
  • Interactive Prototype (html/css/javascript)


The first thing I did was to analyze the current user flow to understand how users are asked to install the app on the website when they are using their phones.

mobile experiment flow

The next step was to research similar products. I wanted to see how other companies push app installs when visitors use their website. Based on the research, I made a diagram showing different approaches and presented it to my team to get a feel about where they thought our design solution should stand. Besides that, I took a look at the analytics to see the types of devices our audience was using. This step was essential to a successful experiment.

mobile experiment research

Then I prepared some wireframes in order to show the stakeholders the solution I had in mind so we could all be on the same page and iterate over them.

After stakeholders’ approval, it was time to polish the screens. I decided to make an interactive prototype because that would allow me to understand how the interface would feel and by doing that, some issues arose that wouldn’t have been noticed had I only done static mockups.

mobile experiment screenshots

The final stage was to work closely with dev to make sure the specifications I gave were followed in the final version. I also presented a slide deck to my team with UX considerations about frequency in which the banner for app install should be seen. I requested that, if the test succeeded, we add some logic to make sure users who have the app don’t see the banner and also if the users close the banner a few times that they shouldn’t see it anymore.

mobile experiment user consideration

main image Home Page

Home Page

Choose your own adventure

The design team at Hootsuite was requested to come up with different versions of our home page as an exercise to capture the best ideas to be tested.


Hootsuite - 2014

What I did:

  • User flow
  • UI design (partial)
  • UX design
  • Interactive Prototype (Axure)


Since the target audience of Hootsuite's website was very broad, it was a challenge to resonate with a specific group of users. This challenge was the starting point of my redesign solution. After connecting with the stakeholders, I identified the main goals and made sure to consider them in the user journey diagram.

One thing I kept in mind was to support business goals and at the same time to help users with their goals. The solution I came up with was based on the “choose your own adventure” concept. I designed a user flow in which Free, Pro and Enterprise users would be taken to different paths depending on the options they chose.

user journey home page

I started sketching this option on paper then I moved on to wireframes to investigate how it would work. I added some basic level of interactivity at early stages in order to see how the design solution would feel when users interact with it and iterate on it.

image home page wireframe

After some iterations, I added more polishing to the prototype, working on user interface visuals and more complex interactions. By the time I was working on this step the team and I decided to merge another design into mine. I made adjustments to make sure the "choose your own adventure" section was visually unified with the already defined sections of the other design.

image home page final


Stakeholders liked the idea because it was a new approach for a home page that had to catch all types of users.

image home page final

main image Employers Page

Employers' Page

The challenge of making an editable page

The goal of the project was to create a page that could be edited by one type of Collegefeed’s partners: small and medium businesses. This page would allow them to promote their business to recent grads. The main design challenge was to create a system that allowed editors to input images and data without detracting from aesthetics and usability.


Collegefeed - 2013

What I did:

  • UI design (partial)
  • UX design
  • Interactive Prototype (Balsamiq)


To solve the challenge of customization without detracting from aesthetics, we decided for inline editing. In this way, the editors could see right on the page how the blocks of text and uploaded images affected the looks of the page in real time. Also, by limiting the number of characters in the text blocks we guaranteed the users would post straightforward information, keeping the page visually interesting and relevant for its readers.

wireframe employers page

Another feature that contributed to a good user experience was the “upload your logo” button. The interface would display the editor’s logo in all sizes that they would appear in the system making editors aware of all the details (if their logo was in a low resolution, they would know right away that it would be a problem when displayed in bigger sizes).

After the interactive wireframes were done and iterated on, I worked on the visuals. The idea was to quickly allow users to distinguish between categories (what is a video, what is a picture and so on). Thinking about that, I used colours code system and icons to support this goal.

wireframes profile picture
image page final

main image Mobile Intro

Mobile Introductions

Creating an unique and engaging experience

The goal of this project was to create a system to introduce employers to recent grads in an unique and engaging way. We chose the mobile platform because it was the environment that our users were in most of their time.


Collegefeed - 2013

What I did:

  • UI design
  • UX design
  • Interactive Prototype (Balsamiq)


Mobile was definitely the way to go accodging to our reserach on users' needs.An integration between text message and a mobile website would be a feasible way to execute and quickly test the idea. The first step was to design the user flow in order to understand how the system would work and analyze the user experience from a holistic point of view.

While doing these wireframes I had 2 things in mind: simplicity (mobile is a tiny screen, we had to be brief and straightforward) and engagement (we had to have interesting visuals that catch users’ attention and encourage them to act at the moment they received the message).

wireframes mobile intro

The next step was to design the screens. I chose a flat design to reflect the transparency of the relationship between potential employer and recent grad. The color palette complemented Collegefeed’s and it was chosen to clearly reflect the refusal or acceptance (green to accept and red to refuse). The color code had to be very clear to make sure the students wouldn’t be confused on such an important moment in their careers. The mockups were tested on an actual phone to make sure buttons were easy to touch and the experience was engaging. Iterations were made later on.

image final

“There are plenty good things to be said about Taís, but the ones that stand out is her thoroughness and standard for doing the work right, not only in result but in process as well.”

Gerard Barcelon | former Head of Desing at Collegefeed

picture Taís

Areas of Expertise

  • - interactive design (UI and UX)
  • - front-end development
  • - branding
  • - visual design

Knowledge of

  • - motion design
  • - 3D


I am a UI and interactive designer based in Vancouver, BC. Considering the needs of the user, I bring ideas to life.

Good interfaces are my passion. I believe in making eye catching interfaces that work well and bring delight to their audience.

I love balancing design practice with my coding skills. Knowing both allows me to quickly create prototypes and get the feel of a project in early stages. This process allows me to show prototypes to stakeholders and by having a functioning representation of the project we can all iterate and collaborate to create a great user experience together.

When I am not working I enjoy reading comic books (I love Sandman, by Neil Gaiman), drawing and doing coding tutorials.