Ksenia is available for hire

Ksenia Kondrashova

Verified Expert in Engineering

Creative Front-end Developer

Location

Tbilisi, Georgia

Toptal Member Since

May 31, 2020

Ksenia is a creative front-end developer who works at the intersection of design and technology. Focused on 2D and 3D visualization, she uses technologies like GSAP, WebGL/Three.js, SVG, Canvas, and GLSL Shaders to create immersive web experiences. Ksenia is well-versed in creating 3D web experiences, 2D animations, browser games, complex scroll animations, interactive maps and infographics, and other visuals.

Data Visualization Animation CSS3 Animation HTML5 Animations Computer Graphics HTML5 Canvas GreenSock Animation Platform (GSAP)GSAP Canvas HTML5 JavaScript 6 D3.js Three.js WebGL Web Development

Portfolio

Self-employed (Freelance)

Three.js, 3D, 3D Art, 2D Graphics, Animation, 3D Modeling, Web Consulting...

Self-employed (Freelance)

2D Animation, Vector Art, Vector Graphics, SVG, GSAP, HTML5 Banners...

Self-employed (Freelance)

Git, Adobe Illustrator, GSAP, HTML5 Canvas, JavaScript, SVG, Three.js, WebGL...

Experience

SVG Animation - 6 years GSAP - 6 years HTML5 Canvas - 6 years Web Animation - 6 years Three.js - 4 years Shaders - 3 years WebGL - 3 years GLSL - 3 years

Availability

Part-time

Preferred Environment

Git, Three.js, GLSL, GSAP, WebGL, SVG Animation, HTML5 Canvas, Shaders, JavaScript, Blender

The most amazing...

...professional decision I've made was to switch from hardware development to computer graphics.

Work Experience

Three.js Developer

2020 - PRESENT

Self-employed (Freelance)

Utilized the Three.js framework to develop immersive and interactive 3D web applications.
Optimized Three.js applications for performance and cross-browser compatibility.
Implemented custom shaders using GLSL to achieve desired visual effects.
Optimized Three.js applications for mobile devices and various browsers.

Technologies: Three.js, 3D, 3D Art, 2D Graphics, Animation, 3D Modeling, Web Consulting, Interactive JavaScript, Terragen

SVG Graphic Developer

2017 - PRESENT

Self-employed (Freelance)

Created interactive SVG graphics with JavaScript or CSS animations, allowing users to engage with the graphics and enhancing interactivity.
Collaborated with clients to understand their design needs and successfully translated their ideas into visually appealing, interactive, and responsive SVG graphics.
Developed responsive SVG graphics that dynamically adjust their layout and proportions based on the device's viewport.
Optimized SVG graphics for performance and loading speed.

Technologies: 2D Animation, Vector Art, Vector Graphics, SVG, GSAP, HTML5 Banners, Interactive JavaScript

Creative JS Developer

2017 - PRESENT

Self-employed (Freelance)

Designed and developed interactive web applications using JavaScript and related technologies.
Built interactive maps with advanced features and interactivity.
Developed animated logos, loaders, and typography for branding purposes.
Implemented complex scroll-driven transitions to enhance the user experience on web pages.
Collaborated with designers and product owners to implement visually engaging user interfaces.
Optimized web applications for performance and usability.

Technologies: Git, Adobe Illustrator, GSAP, HTML5 Canvas, JavaScript, SVG, Three.js, WebGL, GLSL, 3D Graphics, Blender, SVG Animation, Canvas, CSS3, CSS3 Animation, HTML5, HTML5 Animations, HTML5 Banners, Interactive JavaScript

Front-end Developer | Animator

2017 - 2022

Self-employed (Freelance)

Combined front-end development skills with animation techniques to create interactive and visually appealing web experiences.
Developed responsive web interfaces optimized for different devices and screen sizes.
Created interactive cursors and custom mouse interactions to enhance user experiences.

Technologies: Canvas, Canvas 2D, GreenSock Animation Platform (GSAP), GSAP, SVG, SVG Animation, CSS3, CSS3 Animation, HTML5, HTML5 Animations, HTML5 Banners, Interactive JavaScript

Experience

3D Visualizations (Three.js)

https://codepen.io/collection/RzBxzP

Over the course of 3+ years, my expertise has revolved around crafting captivating web-based 3D experiences using Three.js and WebGL. Through my extensive experience, I've explored diverse techniques to create, port, modify, and optimize 3D geometries and materials.

GLSL Shaders

https://codepen.io/collection/vBapBB

Custom GLSL shaders for web usage. All the examples were designed and developed by me. They primarily run with Three.js, and these custom shaders are utilized for product configurators, interactive cursors, and on-scroll animations. You can access the live demos and the complete source code via the CodePen link attached.

SVG/GSAP Animations Collection

https://codepen.io/collection/waxpao

I designed and developed animated vector graphics, including SVG logos, responsive illustrations, lightweight icons, interactive maps and infographics, text animations, scroll-driven animations, and more.

Interactive Cursors Collection

https://codepen.io/collection/BNPJNL

Fun interactive cursors and custom mouse interactions are built to enhance user engagement and interactivity. The examples are created using SVG, GSAP, Canvas, Three.js, GLSL shaders, and other technologies. They all have been thoroughly tested across different browsers and devices of various sizes.

Product Configurators Collection

https://codepen.io/collection/jbpYbL

I developed 3D product configurators using Three.js to provide customers with an interactive product exploration experience.

In the public collection, you can find configurable realistic 3D products, such as a cartoon box, glass and dice, as well as fun projects like human eye and tornado.

Data Visualization

Designed and developed data visualizations:
• Data processing with and without D3.js
• Rendering using SVG, Canvas API, and WebGL
• Complex dynamic data and simple dataset
• Responsive and interactive solutions

3D Dice Roller

https://codepen.io/ksenia-k/full/QWZVvxm

An interactive dice roller web application. The cannon-es library helps to implement realistic physics, while dice shapes are done with Three.js. There are a number of parameters that are easy to configure, like the shape, color, number of cubes, etc.

Skills

Languages

CSS3, HTML5, JavaScript 6, JavaScript, GLSL, CSS

Libraries/APIs

HTML5 Canvas, GSAP, Three.js, WebGL, D3.js, JavaScript Charting, Babylon.js

Tools

Canvas, Canvas 2D, Adobe Illustrator, JavaScript Debugging, Git, Blender, Terragen

Paradigms

Responsive Layout, Responsive Coding, Responsive Web Design (RWD), Testing

Platforms

GreenSock Animation Platform (GSAP)

Other

SVG Animation, Web Animation, Data Visualization, Vector Graphics, SVG, Scroll Animations, 2D Graphics, Animation, 2D Animation, CSS3 Animation, HTML5 Animations, HTML5 Banners, Interactive JavaScript, Responsiveness, Web-ready Graphics, Online Graphics, Motion Graphics, Graphics Processing Unit (GPU), 3D Graphics Engines, Computer Graphics, 3D Motion Graphics, Art Optimization, UX Prototyping, Cross-browser Compatibility, Shaders, Vector Art, 3D Graphics, Product Management, Product Marketing, Web Consulting, Typography, Development, Web Development, Graphics, Version Control, Version Control Systems, Mesh Optimization, Cross-browser Testing, Hardware Development, Microcontrollers, Microcontroller Programming, 3D, 3D Art, 3D Modeling, 3D Maps, Physics, 3D Games, 3D Animation, GPU Computing, User Interface (UI), Programming, Algorithms, Optimization, Visualization, 3D Design, IT Management, Software, Software Design, Software Development

Education

2012 - 2014

Master's Degree in Embedded Electronics

Peter the Great St.Petersburg Polytechnic University - Saint Petersburg, Russia

2008 - 2012

Bachelor's Degree in Computer Science

Peter the Great St.Petersburg Polytechnic University - Saint Petersburg, Russia

Certifications

JANUARY 2023 - PRESENT

Three.js Journey Completion

Three.js Journey

JULY 2017 - PRESENT

Front-End Web UI Frameworks and Tools

Coursera

Collaboration That Works

How to Work with Toptal

Toptal matches you directly with global industry experts from our network in hours—not weeks or months.

Share your needs

Discuss your requirements and refine your scope in a call with a Toptal domain expert.

Choose your talent

Get a short list of expertly matched talent within 24 hours to review, interview, and choose from.

Start your risk-free talent trial

Work with your chosen talent on a trial basis for up to two weeks. Pay only if you decide to hire them.

Top talent is in high demand.

Start hiring