NASSOS YIANNOPOULOS CV

WebGL real-time PBR 3D painting web-app (proof-of-concept) with support for pressure sensitive tablets (wacom) using custom shaders/code.

Custom Shopify theme with all the animations in Rive done by me.

Endless scroll page with custom WebGL transitions.

Flowhub wobbly button GLSL. Due to Safari's buggy svg filters this needed to be done in WebGL.

DIMO Hero animation and 3D elements

Coffee showcase written in Three.JS/GSAP/Nuxt.JS/Vue.JS/Sass/ES6/webpack

Mindsparkle Mag Site of the day CSSDesignAwards Website Of The Day 2021 Jun 29

Promotional static site with animated transitions GSAP/Nuxt.JS/Sass/ES6/webpack

Corporate site statically generated with Nuxt.js and headless GraphCMS ES6/GSAP/Nuxt.JS/GraphCMS/Sass.

Refactoring of an existing site to add more motion graphics dazzle, custom webgl effects, animations with GSAP, Custom ES6 GSAP/CSS3/Vue.JS/Swup.JS/Webpack.

Full-stack server and front-end site with in-place editing Nuxt.JS/Adonis.JS/GSAP/Webpack

Redux based state-machine, custom canvas effects, animations witth CreateJS, Custom ES6 JS/HTML/CSS.

WebGL experience combining Video and custom GLSL Fragment Shaders, Custom ES6 JS/HTML/CSS.

Awwwards Site of the Day Honorable Mention

ES6 JS/HTML/CSS width WebGL shader transitions and custom swirly particle system

Custom JS/HTML/CSS GSAP

Custom canvas effects/animations, JS/HTML/CSS

Custom responsive site front-end written from scratch in HAML/SASS/JS. It featured custom touch interception handlers to support scroll animations (in the “About” and “Case Studies”) even on mobiles with no support for events during scroll. Ajax was used to get further data in the “About” page and CSS3 and SVG was used for the animations found in the various pages.

Interactive map widget for finding pickup spots Vue.JS/ES6/GoogleMaps/Webpack

Custom responsive site front-end written in JADE/SASS/JS with AJAX navigation throughout the pages. It features a custom-made gallery with various transitions that changed depending on the device and a special case video UI to hide the underlying youtube controls.

Responsive news site with the front-end written from scratch. All controls are custom, except for some horizontal slideshows that use slick.js

Custom single page site written using the HTML5 Canvas JS API directly, to allow for interactive animations even on tablet devices. The final site ended up being a cut-down version of the original design and the server seems to be having some problems finding the thumbnails.

Custom site written in JADE/SASS/JS featuring a special-case horizontal pdf viewer with an expandable TOC.

for the the campaign “Dyo Einai Oi Tropoi” (“There are two ways”)

A 3D Kinect game that allowed up to 2 players to compete by virtually milking their on-screen cows to fill as many buckets they could, within a 2 minute time period. The winner had their headshot automatically captured by the kinect camera, sent to the server and had the ability to register and share their victory pic through FB, using the on-site iPad with a custom app written specically for the campaign.

At the mall events, one of the kiosks was a digital station, featuring a live game also named “Milk the Cow,” which challenged visitors to fill as many buckets of milk as possible in the given time. This game utilized gesture-recognition technology and players were asked to complete their registration by logging into their Facebook account and sharing their results or providing an email address etc.

The truly innovative aspect of the Dyo Einai Oi Tropoi campaign was the utilization of the gesture recognition technology of Kinect for Windows v2 in conjunction with a web game that had the same gaming principles, both of which were connected to users’ Facebook accounts.

Client-server app for offloading video conversion and distribution to customers, with both GUI frontend and web frontend (GreenOliveFilms)

A desktop GUI client, that handles the task of recognising the uncompressed movie files dragged onto it, parsing its format and time range, and uploading all the necessary data to the server-side so that it can be encoded and delivered to the respective clients. It constantly shows the state of the encoding, ftp uploading and email confirmation sending from the server. A history log is kept of all the encoding jobs submitted thus far. It also keeps a registry of client companies with their email, ftp, movie format requirements, people that may approve a job version, address, etc. The desktop client is autoupdated when a newer version is made availlable from me.

The server-side is console app that waits for jobs from multiple desktop clients and handles the format conversion of all the files, ftp uploading, approval requests, and email confirmations to the final company clients.

Both are written to be multithreaded (in C#) and non-blocking (as much as possible) in order to maintain immediate response to the work load. The communication is done using the thrift protocol that allows for reliable language and transport-stream independent data communication.

There is also a web interface written from scratch in PHP+MySQL (backend) and Javascript (frontend) that facilitates client approval, client file preview and download, and statistics display.

3D voronoi shatter and non-concave dynamics plugin

A dynamics plugin for Softimage ICE, based on the Bullet engine, that circumvented softimage’s geometry creation limitations from inside ICE and allowed for artist-friendly and controllable dynamics simulations along with user defined real-time geometry shattering and continuous fracture using Voronoi fragmentation.

Video creation using audio beat recognition

An iOS application that takes as input an audiofile and a set of pictures from the media library, analyzes the audio and creates a music video, using Apple’s native AVFoundation Kit, with pictures in perfect sync to the sound.

a lip sync program designed to line up phonemes for animation.

A GUI application that facilitates the breaking of dialog text into discrete phoneme poses in a semi-automatic and artist adjustable way. The user imports the dialog text from file for one actor character at a time. The dialog is broken down into phonemes according to language rules (English, Spanish, Greek, etc) and displayed underneath the audio waveform. From there the artist can adjust both their position and length or change them completely, as he sees fit. There is a dynamic lip-syn preview below the waveform so that the artist can test at any time the result without the need to export. When done, the phonemes can be printed as an X-Sheet or exported to Excell, PDF or 3DSMaxScript for further processing and/or application to the scene.

a holiday flash game for GreenOliveFilms

A holiday game written in ActionScript 3 (Flash), where the main character is a bear that collects the falling candy while avoiding the exploding items.

a restaurant app for findings deals near you. (GreenOliveFilms)

A smartphone/mobile application that contacts a server for restaurants in Cyprus and their menu and offerings. It displays they best lowest offers to the user in accordance to his interests and purchase history. It makes it easy to book tables, call the restaurant and find his way to the geolocation using google maps. The app was originally written in Sencha Touch (Javascript) but due to low performance and many other issues i decided to re-write it natively in Objective-C for the iPhone and Java for the Android.

Gesture recognition and conversion to printable diagrams

An iOS app that allows the user to draw shapes with his finder naturally (as if on a chalkboard) and have them be automatically converted to pixel-perfect ones ready for presentation and printing. Connect those oval/rectangle/rhombus shapes with a simple fling of the finger instead of using complex UIs. Delete or alter them in the same way.

An OSX background daemon that monitores data sent from an external usb dongle connected to the computer and opens the appropriate web pages, without user intervention.

An Windows background service that monitores data sent from an external usb dongle connected to the computer and opens the appropriate web pages, without user intervention.

An iOS application for secure logging-in/out and recording the dailly presence/absence of children and entering parental information and other data, with a graphical user interface appropriate for sight-impaired and/or elderly people.

A minimal filesystem creation assignement, written in assembly and C, for a university course of a canadian student.

card game for iOS

A complete rewrite of a card game named Belot (bulgaria) to the Unity platform, in C#. It was originaly a single player game but i added online and bluetooth peer-to-peer multiplayer capabilities so that up to 4 real-life people can play realtime in the same session, using the native iOS GameCenter.

Augmented reality app for Laiki bank

An Augmented Reality app that advertises some services of Laiki bank in Cyprus using 3D realtime animation. Created on the Unity 3D platform in C#.

mobile app for feelfamous.gr site

A mobile application that allows the user to browse/read the articles from the site in a clear consise way that is well integrated with Facebook, Twitter and Youtube functionality. The user can like, share, and tag articles and photos on FB, tweet them, favorite and print them.

He can also edit the photos of the site (it is mainly a photographic site) applying photo filters like instagram, badges, and text, and crop/size them to share on any social site. By request of the publisher the app was originally written using the Titanium SDK (Javascript), but due to the single threaded nature of javascript doing background HTTP requests (and other tasks) was impossible, so i rewrote it natively in Objective-C for iOS and Java for Android. Parse is used for analytics and push notifications.

Augmented Reality app

An Augmented Reality client app that continuously scans for marker images using the mobile’s camera and shows the respective video content on the region of the marker in 3D or fullscreen. Written with the Unity SDK in C#, but due to limited media handling i had to write significant parts of it in native Objective-C for iOS and Java for Android. Parse is used for analytics and push notifications. Custom Media synchronization was needed as the native movie player classes work only in fullscreen and do not interface with OpenGL used by Unity.

Web backend for adding/converting and serving video content

The web interface was hand-coded from scratch in PHP and MySQL using the Agile Toolkit web framework on a CentOS linux server. Media conversion and analysis is done using ffmpeg and sox, while cron is used to handle background PHP tasks asynchronously. The frontend of the interface is written in Javascript using JQuery, Bootstrap, Moment, Bootbox and VideoJS for the video previews.

Augmented reality app

An Augmented Reality app prototype for LIDL that recognised products and showed their current price tags hovering above the product and related product offers.

Augmented reality prototype

An Augmented Reality app prototype for IKEA that recognised products in magazine pages and showed 3D animations for relevant product offerings.

Augmented reality app

An Augmented Reality app that showed 3D animated information relevant to the car showing in the mobile’s camera.

Augmented Reality Game

An Augmented Reality game that offered battles with real-time 3D animated characters using their physical cards.

Photoshop plugin to transfer assets to flame (GreenOlive)

An Adobe Photoshop plugin that converted and tranfered layered image documents to the Autodesk Wiretap server for import in Autodesk Flame/Inferno compositing suites.

clipboard tranfer app

An iOS app for the automatic transfer of files and images from the desktop/laptop computer to the iPhone/iPad and vice-versa by copying or cutting them (Ctrl+C/Ctrl+x)

windows video manipulation utilities (GreenOliveFilms)

A suite of utilities for doing image file sequences conversion into movie clips, movie clip into image sequences, and format conversion in an automated and user friendly way. The suite uses TheFoundry’s Nuke compositor for complex operations.

Batch Conversion of camera raw files into a Flame compatible format

A program that took as input movie clips in camera raw format shot on a Canon 5D compatible camera and filtered, color corrected and converted them into 16-bit floating point EXR frames for import into Autodesk Flame/Inferno compositing suites.

DVD iso creation from various source inputs (GreenOliveFilms)

A collection of utilities for the automatic creation of a legacy-compatible and standards compliant ISO file of a DVD in interlaced/non-interlaced NTSC and PAL formats, from folders containing image sequences+audio file or quicktime/windows media files.

Gmail contacts synchronization among multiple email accounts (GreenOliveFilms)

A background application (daemon) that scans all the google accounts, belonging to a company, for changes and synchronizes new information between them while removing duplicates and fixing utf character encoding issues during the import of contacts from third party desktop applications like outlook.

An outlook plugin that synchronized the application’s contacts with those found in the company accounts in google app engine. Contacts not present in the outlook database where also imported from google.

Houdini surface operator and geometry exporter

A compiled Houdini SOP (surface operator) that supported reading and writing .pc2 geometry cache files

softimage plugin

A suite of motion graphics related ICE compounds for Softimage. They are intended to mimic cinema4d’s MoGraph tracer functionality.

softimage surface operator plugin

A surface op for Softimage that creates multiple procedural copies of a mesh which can be accessed and manipulated from an ICE tree. Like Houdini’s Copy/Duplicate SOP.

softimage rendering operator

A tool for Softimage that automatically setups an additional MaterialID framebuffer to the current pass and modifies all the applied materials to store a unique color in that framebuffer for later manipulation during compositing.

softimage operator plugin

A compiled effector operator for Softimage, that eliminates the snaping that occurs when an IK chain extends towards its full length during animation.

sotimage plugin

A compiled surface op for Softimage, that converts polygons to NURBS by selecting parallel edge loops.

softimage ICE operator

An ICE geometric operator for Softimage that averages the positions of points with similar U and V parametric coordinates. Usefull with TGen plugin and cylindrical objects, for creating growing vines effect.

softimage ICE operator

An ICE operator for Softimage that creates strands on the source surface that are curvy and tapered at the top to look like blades of grass.

softimage ICE operator.

A compiled C++ node which concatenates (merges) per-point attributes (even arrays) into per-object arrays for use in Softimage XSI ICE system.

3D renderer compliant with the RenderMan Interface v3.1 that supported reading RIB files (both ASCII and encoded bytestreams), with complete hierarchical graphics state including attribute and transofrmation stack and active light list, spatial and temporal filtering for the removal of aliasing artifacts, custom “hider” algorithm for depth of field effects without the need to use the REYES architecture, gamma correction and dithering before pixel value quantizarion, user defined arbitrary output variables in the TIFF display driver. Polygons, Basis Patches, Quadrics, NURBS, procedural and retained geometric primitives were supported and Spatial Set Operations were allowed (booleans). Textures support included unfiltered image files, besides the standard mip-map pyramids. All kinds of varying, uniform, per point and per face attributes were supported. The custom architercture used allowed for fast displacement mapping and fast motion blur, without the need to calculate extra shading samples.

PCCTS was originally used for the creation of the Shading Language compiler, but it was later rewritten with an early version of ANTLR and finally hand coded in C due to the limited error handling capabilities both offered.