Technical UI Designer Portfolio

Anna Katsouli / virimine

– NOTES –
Most of the projects displayed below were collaborative efforts, so not every aspect is solely my work.
Some videos have been reported as not playing correctly on mobile browsers. If you encounter issues, please switch to Desktop.
Thank you! (:

UI / UX DESIGN

Client Project

A pet simulation game for children

PROJECT LINK:

RELEASE DATE:

PLATFORMS:

N/A

Android, iOS

UI IMPLEMENTATION / MOTION DESIGN

Achievements UI | Technical Test

A technical UI assignment created as part of a recruitment process

PROJECT LINK:

RELEASE DATE:

PLATFORMS:

available upon request 🙂

2023

Mobile

TASKS

– Imported assets in Unity from Figma, – Card content scales based on text length, using the Unity Layout Components.
– Added support for multiple horizontal screen aspect ratios.
– Dynamically populate Achievements List.
– Designed motion graphics.

MOTION DESIGN THINKING

Subtle motion has been used with the intention to guide player gaze. 1) The title and counter appears first entering from the sides. 2) Cards fade in one by one. 3) Text appears based on hierarchy and reading order. 4) Icon uses an opposite motion to create contrast. 5) Scrollbar fades in to indicate that the list is now scrollable.

PROBLEMS AND SOLUTIONS

ISSUE 1: Nested Layouts kept breaking stuff.
SOLUTION: Had to refresh memory on layout structures, lots of googling and trial and error.

ISSUE 1: Dynamically populating card list resulted in UI not being updated correctly. SOLUTION: Used Coroutines and Animations to add a delay for the UI graphics update.

TOOLS

– Unity Engine (GUI, Animation, Animator), C#, Visual Studio, Git, Adobe Photoshop

UNITY DEVELOPMENT / TECHNICAL UI ART

Star Academy by Rocket Cola Studio

An educational game for children to learn essential skills in English

PROJECT LINK:

RELEASE DATE:

PLATFORMS:

2023

Windows, Mac, Android, iOS

Star Academy – (from top to bottom): (1) Highlights Reel, (2) Main Menu Variations & Animation, (3) Victory Panel Variations & Animation, (4) Word Ride Full Gameplay, (5) Magical Forest Full Gameplay

ROLE

Unity Developer
Technical UI Artist

TOOLS

– Unity Engine (GUI, Particle System (Shuriken),  Animation, Animator, DOTween)
– C#
– Visual Studio
– Git
– Adobe Photoshop
– Trello
– Google Suite

CREDITS

Rocket Cola Studio

RESPONSIBILITIES

– Developed multiple mini-game prototypes, using the Unity’s GUI system, from concept to final product while adhering to design guidelines. These prototypes were modified and used to make over 400 interactive exercises.

ACHIEVEMENTS

Understanding both technical and artistic aspects assisted in saving time from development by :
– Creating and integrating visual assets with a detail-oriented and quality-focused approach, leading to less iterations and evaluations.
– Explaining technical processes to artists and designers in a clear and comprehensible manner, resulting in fast and effective decision making.

LESSONS

Working on a long-term project has provided valuable insights into the significance of code architecture, automation, and reusability. It has allowed me to grasp the fundamentals of code principles and patterns while learning to operate within established procedures and coding standards.
This experience allowed for the enhancement of problem-solving skills, gained insight, and a deeper understanding of production aspects.

VIS DEV / TECHNICAL ART (2D/UI)

Abysmal | Ludum Dare 48 (team)

A building, simulation, management gamejam game

PROJECT LINK:

RELEASE DATE:

PLATFORMS:

ABYSMAL – (from left to right): (1) Main Menu / Credits, (2) Game HUD, (3) Ambience VFX, (4) Process Breakdown: Assets Integration

ROLE

Vis Dev Artist
Technical UI Artist

TOOLS

– Unity Engine
(GUI, Animation, Animator, Particle System (Shuriken), Shadergraph)
– C#
– Visual Studio
– Adobe Photoshop
– Git

RESPONSIBILITIES

– Collaborated closely with the fellow artist to establish the game’s visual style and atmosphere.
– Designed, animated, and integrated the Main Menu and HUD elements.
– Created and integrated VFX by utilizing cropped parts from the character graphics and the Particle System component to enhance the visual experience.
– Created shaders to produce seamless gradient effects for the background and tile materials.

GOALS

In this game jam, my primary aim was to enhance the overall look and feel of the game while challenging my recently acquired technical art skills within the given time constraints. Additionally, I sought to explore and experiment with UI design and engineering.

CREDITS

design & code: GeorgyAngelov, BloodyStupidViktor, Pulni
visuals: Nefi Louko, Virimine

DIRECTION / PRODUCTION / GRAPHIC DESIGN

Banquet | personal team project

A top-trumps card game clone that consists of 22 food and drink cards

PROJECT LINK:

RELEASE DATE:

PLATFORMS:

2021

Physical, Printed

Banquet – (from left to right): (1) Card back (2) Carrot Cupcake Card front, (3) Banner, (4) Mock-up Image

ROLE

Producer
Visual Artist
Game Designer

TOOLS

– Adobe InDesign
– Adobe Photoshop
– Trello
– Google Suit

CREDITS

Virimine & Yasen Dokov

 
 

 

 

RESPONSIBILITIES

– Led the visual identity of the game and created the visuals (illustrations and graphics).
– Co-designed the game mechanics, rules and did the writing.
– Oversaw the game’s production by assigning tasks, setting goals, and establishing deadlines, using Trello and the Kanban methodology.

GOALS

Download Banquet’s Image Story to read what is more or less written below, in a more fun way.

The intention was to develop a physical card game, featuring foods and drinks for the buffet at my thesis presentation. Our aim was to craft a game tailored for a non-gamer audience. To achieve this, we decided to use the mechanics of a popular game, assuming that most people would be familiar with a top-trumps variant. Banquet was created specifically for social gatherings, aiming to break the ice and promote interactions among guests in a lighthearted and playful manner.

Scroll to Top