UI/UX Designer // Alena Delena

Digital Painting // Alena Delena

close

I started drawing digitally in 2007 through a website called RateMyDrawings (RMD) where I was introduced into the amazing community of digital artists. They encouraged me to keep drawing and although I still have a long way to go, they helped me become the artist that I am today

Medium
RMD's ChibiPaint, Photoshop CC/CS3

Daily Sketches // Alena Delena

close

During 1A, I sketched almost every day

Medium
Moleskine Sketchbook, Pencil, Micron Sakura Pens

Three Prompts One Drawing // Alena Delena

close

On January 2016, I started an ongoing personal project called Three Prompts One Drawing. The idea is to create cohesive and imaginative illustrations using three random prompts given by random people.

Medium
Sakura Micron Ink Pens, bristol board, Photoshop CC

Date
January 2016

Viking - Designer clothes - Summer Sports

Aggressively British - Wolves - Afternoon Tea

Skyscrapers - Robots - Ice fishing

Bees - Persian rugs - Swords

Fancy Dinner Date - Paintings - Polar Bears

Skydiving - Otter - Pineapples

During highschool in grade 12 I worked as a UI/UX design intern at Chalk.com

During the summer and winter of grade 12, I worked as a UI/UX design intern at Chalk.com. Working with my mentor and design lead, I mainly focused on illustration during my first month in the summer.

The process began with several sketch iterations on my sketchbooks and constant feedback from my mentor until we both found something suitable. We considered the goal of the illustration and the message it needed to convey. It was important to sketch out as many ideas as possible, no matter how 'out there' it was.

Tools Used
Asana, Photoshop, Illustrator

Date
January 2014 // October 2015 - January 2015

Mockups of the website's mobile version

At Chalk.com I learned the process of design. Here is an example of my process behind designing some badges for a reward system to be considered for the webapp. It starts from the bottom and evolved to the top. The plan was to create three different but visually cohesive badges to reward teachers when they refer a certain amount of people to the site.
I started by Googling real medals and badges for inspiration. I even used TheNounProject.com to find inspiration on different items that can symbolize reward and teachers. Then I sketched as many ideas as I could in my sketchbook and receive constants feedback and opinion from my mentor. At first, I thought a purple and yellow banner with pens across each other would be a good idea. I believe this was because of my love for video games. I didn't realize that the idea of pens displayed as if they were crossed like swords would be weird for an app for teachers.

Needing to come up with a better idea, my mentor suggested that I use methods of communication for illustration. The smallest badge was an envelope because it is usually sent to one person at a time. A megaphone was chosen for the second badge because they are louder and can be heard by more people. Finally, I thought of using a telephone antenna for the largest badge because it reaches far and wide. Slowly, through iteration and critique, my designs were improved until my mentor and myself were satisfied.

I learned a lot from this process, such as being patient with iteration and learning to think outside of my own biases and personal experience, and I also learned to work collaboratively with another artist and designer. This was the first time my eyes were opened to basic design principles, a knowledge necessary for a UI/UX designer.

Illustration Sketches

University of Waterloo design teams get a new look

Tools Used
Illustrator

UW Midnight Sun
2016

The new logo has two versions, a circular badge and a horizontal bar. This was to ensure the flexibility of the design. The idea of the polygon sun was that its non-spherical shape gave energy to the logo and served as a metaphor for the solar panels on the race car.

Waterloo Formula Electric
2016

UW's previously Waterloo Hybrid Team wanted to incorporate something more into their new logo and identity as a fully electric team. A connection to the school was important, but also the spirit of the race. This work was inspired by the old logo, the school's colours, as well as Top Gear's The Stig.

I consider my strongest asset in UI design to be vector illustration

I especially love to create characters full of personality. I don't have many personal work to show but I have some examples of what I can do. At my internship at Chalk.com I joined the team just in time when they started thinking of incorporating a mascot into their product. I helped integrate the mascot, Mr. Chalk, into their logo and app. I thoroughly enjoyed giving him a personality while I positioned his body to express a feeling, such as depicting apologetic body language in a 404 message. Today, Mr. Chalk is a big part of the company's brand and I am proud to say that I was able to contribute greatly to the company that way in highschool.

During co-op at Kik, I used my illustration skills another way. It was a challenge to design icons and illustrations for the messaging app because there are not very many symbolic visuals in it. I was constantly reminded of the requirements I now know very well, "it must be very simple and straightforward, but fun. Engaging, but not too stylistic." Though, I love a challenge because it forces me to be even more creative.

I utilized my visual skills to create icons such as check marks, the bot icon and smaller scale visuals that properly represented the message it was associated with. I know that these seem like very little things, but what I learned during my coop term was that simple icons like these are so much more intricate than what they seem. Every pixel, degree of angle, curve of shape and color mattered a lot! I remember spending a whole day thinking and iterating on one simple but very important icon to make sure it was perfect, constantly asking for feedback and critiques from my team members.

I illustrate in my free time as well, and it resulted in one of my most favourite characters: Mittens. He is a worm-like, platypus-like, duck-like, yellow creature that some say they can very well relate to. The office at Kik now use him as a reaction emoji on Slack.

Tools Used
Sketch for Mac, Illustrator

Mr.Chalk marking some papers for Markboard
2014

Mittens as a sticker!
2016

My first co-op at the University of Waterloo was at Kik as a UI/UX Designer

The engineering department at the University of Waterloo requires their students to work as an intern at a company for four months at least 5 times during their 5-year program. This is a great way to get real life experience in our field of study and by the time we graduate, we would already have at least two years of work experience.

I worked closely with a product manager and I was required to make sure that I was fluent with the design specifications of every project I was assigned to before I even started. I then iterated on my designs, while constantly meeting with the product manager to keep each other up to date and receiving feedback from other members of the design team. It was very important that we addressed the user and the ultimate goal of the design project.

During this term I learned a lot of basic design concepts and technical skills, such as applying proper spacing between text and images that is dependent on context and association, the hierarchy of elements, and the differences between iOS and Material design. I also developed a better sense of designing for the user, rather than for the app. I learned to always have a mockup of my designs ready on a phone so I could think of myself as the user and always question if the flow made sense.

Tools Used
Sketch for Mac, Zeplin, Principle, Trello

iOS Report Feature

Categories were added to the existing 'Report' dailogue to identify user concerns, better understand the issue and contribute to finding a solution. It was essential that the icons expressed what the user could be feeling and the description was straightforward for the most accurate report.

Definicious Bot

During Kik's Hackweek, I learned how to code a Kik bot from scratch using Python without much prior experience with the language. The purpose of the bot was to simply recieve a word from the user and send a reply with definitions and examples that all came from Urbandictionary.com

Kik.me/g Webpage

When Kik users want to invite their friends to a Kik group, they may share a unique link, Kik.me/g/. In the case that it is clicked from a computer, it leads to this page. It is simple and straightfoward, and encourages the friend to download the app if they don't have it already.