NASSOS YIANNOPOULOS CV

Profile

I am a self-taught and self-motivated programmer with 25+ years of experience in software development.

(15+ in Front-End Dev)

I began learning how to program at age 12 and have never stopped. Fascinated by well-designed and even exotic computer languages I passionatelly try to explore new technological territories. I pick up new languages easily, deeply enjoy doing research and am a natural problem solver. I love the thrill of making new discoveries and crossing new frontiers.

When faced with the task of writing a new application, I begin by identifying its ‘core’ so that I can develop a clear insight about the technology that is best suited to the purpose. Because of my long and varied experience I can confidently deal with any issues that can arise.

What distinguishes me is that I mainly write custom code. I am not dependent on open-source (or other 3rd party) library availability but have no issue using them to their full extent, if they fit the project requirements. I consider myself as someone who gets-things-done and take pride in it.

I am also passionate about are 3D computer graphics, games and the technology behind them. I enjoy working on model sculpting, animation, dynamic simulation rendering and element compositing. I am keen to explore new possibilities in these realms as these open up.

Skills

Currently I mainly work in Javascript (ES6) and have experience with frameworks such as Next.js/React, Vue2/Nuxt, Alpine.js, TailwindCSS, Shopify/Liquid and libraries like Three.js and Gsap.

The programming languages I am most experienced with are derivatives of C. These include (but not limited to) Javascript, Objective C, C++ and C#. I also have ample background working with other languages, including Python and PHP. Good working knowledge of version control systems such as Git and SVN. Experience building websites that are SEO friendly, performance optimized and accessible to a AA/WCAG 2.1 standard. Also do love the prospect of coding in a functional language as their composable nature provides a more ‘organic’ route to problem solving.

I mostly develop in IDEs such as VSCode (ES6) but in the older days i relied upon Apple’s XCode (for Objective-C) and Microsoft’s Visual Studio (for C#).
For cross-platform (usually game-related) programming, I mainly rely on Unity3D, but Ι’m also exploring tools like HaXe/OpenFL/Kha, Cocos2d-X. (not anymore)

Other tools I’ve worked with include compositing packages like Shake, Combustion, Nuke and After Effects, ZBrush for 3D sculpting, Houdini for fluid/pyro simulation and special effects, Maya and Softimage for 3D animation and modeling.

Experience

PaintGL

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

PaintGL

Sliide

Dungeons & Dragons Coffee

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

OpenFortune

Peoplism

Paylabs

NoTwoWays LookBook

Endless scroll page with custom WebGL transitions.

Mapbox custom windy layer

Flowhub

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

Dimo

DIMO Hero animation and 3D elements

Aescape

Acupanel

ABC Dumplings

Distillo Caffe

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

Mindsparkle Mag Site of the day

Karamolegos 24x10 promotional page

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

Stager corporate site

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

LunchBags

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.

El-translations

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

El-translations

Arktouros Game

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

Feel Sani

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

Awwwards Site of the Day Honorable Mention

Nespresso Origem

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

AB Christmas Cards

Custom JS/HTML/CSS GSAP

Apotamieusi

Custom canvas effects/animations, JS/HTML/CSS

Interweave Agency (original site 2014)

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.

Cleverpoint map widget

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

cleverpoint-widget

AthensON

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.

aAthensON-1AthensON-2AthensON-3AthensON-4AthensON-5aon-mod-1aon-mod-2aon-mod-3aon-mod-4aon-mod-5

AV

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

av-mob-1av-mob-2av-mob-4av-mob-3av-mob-5av-mob-6av-mob-7av-mob-8av-mob-9av-mob-10av-mob-11av-mob-12av-mob-13

Grecotel 40years

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.

Regional Tourism Plans

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

insete-1insete-2insete-3

“Horio Butter” Kinect Game

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.

ho_butter

TvStatationEncode

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.

Softimage dynamics plugin

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.

FlipPicture app

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.

PapagayoMod

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.

Phil the Philanthropist

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.

ResaurantCard

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.

GestureDiagram

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.

OSX Daemon service

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.

ChildrenCome app

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.

ChildrenCome app

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.

FileSystem creation

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

Bellot card game

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.

Laiki Cypria Life AR

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#.

FeelFamous Mobile app

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.

Youtruck Active AR

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.

Youtruck Active Web backend

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.

LIDL prototype AR

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.

IKEA AR

Augmented reality prototype

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

Xaralampous AR

Augmented reality app

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

CthulhuCards AR

Augmented Reality Game

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

Photoshop-to-Wiretap plugin

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.

AutoClipboard app

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)

Video converstion utilities

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.

Raw2Exr

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.

Mutlisequence DVD (C++, Autoit)

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.

GmailContacts Sync app

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.

GmailContactsSync Outlook plugin

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 SOP

Houdini surface operator and geometry exporter

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

ICE MoGraph

softimage plugin

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

PolyMesh Duplicator

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.

MaterialID

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.

SoftEffector that respects existing contraints

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.

Edges 2 NURBS (C++)

sotimage plugin

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

UV Thinner (ICE)

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.

Create Grass (ICE)

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.

PerPoint2Array (ICE/C++)

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.

RenderMan Compliant 3D renderer (C/C++)

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.

Misc Dev work

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.

Graphic design work

Contact Me

Thanks for contacting us!

Sorry, we could not reach our servers. Please try again later.