Stefan Vitasovic, JavaScript Developer in Belgrade, Serbia
Stefan Vitasovic

JavaScript Developer in Belgrade, Serbia

Member since October 18, 2018
Stefan is a creative front-end engineer inspired by modern interactive layouts and smooth animations. With his sensibility to design, he is focused on developing high-end UI and UX. Having worked on close to 150 web projects so far with various design and development teams, he loves being on board from the initial concept until the final deployment. He is passionate about bringing digital ideas to life.
Stefan is now available for hire

Portfolio

  • Qode Themes
    Adobe Photoshop, WordPress, PHP, Ajax, jQuery, JavaScript, SCSS, CSS3, HTML5
  • Qode Themes
    WordPress, jQuery, CSS3, HTML5

Experience

Location

Belgrade, Serbia

Availability

Part-time

Preferred Environment

Windows, Visual Studio Code

The most amazing...

...privilege was to achieve the Site of the Day and Developer Award within the Awwwards community.

Employment

  • Lead Front-end Developer

    2015 - PRESENT
    Qode Themes
    • Developed creative concepts for premium WordPress themes as one of the leading ThemeForest authors.
    • Programmed creative front-end focusing on web interactivity with high-end UI and UX.
    • Developed and implemented highly interactive front-end features with corresponding back-end logic.
    • Offered both strategic and creative decisions related to the implementation of new concepts and functionalities.
    • Developed custom WP theme shortcodes i.e. page layouts, sliders, and carousels, fullscreen designs, portfolio lists etc. with a special focus on engaging landing pages.
    • Collaborated with a number of teams - developers, designers, and content editors. Participated in development of close to 150 premium WordPress themes currently available on ThemeForest.
    Technologies: Adobe Photoshop, WordPress, PHP, Ajax, jQuery, JavaScript, SCSS, CSS3, HTML5
  • WordPress Themes Support Consultant

    2014 - 2015
    Qode Themes
    • Provided customer support for premium WordPress themes buyers through emails and ticketing system.
    • Maintained WordPress themes.
    • Created theme documentation.
    Technologies: WordPress, jQuery, CSS3, HTML5

Experience

  • Personal Portfolio
    https://stefan.lynxdev.io/

    A creative showcase of my work portfolio - designed and developed as engaging fullscreen layouts with scroll-based effects featuring video showreels of featured projects.

  • Etienne - Refined Multipurpose WordPress Theme
    https://etienne.elated-themes.com/animated-slider

    As a creative lead, I've agreed with the designer to go for a more interactive approach and breathe some life into existing designs. This project is full of timed bezier-based loading effects, nice UI hover effects, as well as other more innovative features.

    I’ve really enjoyed developing a custom fullscreen carousel which incorporates more interactive slide transitions. Another interesting functionality is the <page marquee, featured as a seamless image scrolling behind the content using requestAnimationFrame to achieve that 60fps rendering.

  • Penumbra - A Contemporary Multi-concept Portfolio
    http://penumbra.edge-themes.com/landing

    Creative front-end programming for a premium WordPress theme, featuring custom landing page concept I’ve created to showcase the dual skin feature along with custom parallax scrolling effect for homepage items.

    To emphasize modern design tendencies within this project I’ve developed multiple highly interactive layouts which include a custom fullscreen scroll-triggered slider with images crossfading inside a laptop frame synced with the corresponding textual description, parallax scrolling portfolio lists, and full-page interactive links layout.

    Featured:
    - Case Study Slider: http://penumbra.edge-themes.com/case-study-slider
    - Interactive Links: http://penumbra.edge-themes.com/interactive-links

  • Bard - A Theatre and Performing Arts Theme
    http://bard.mikado-themes.com/landing

    The idea I had with this project was to introduce contemporary and interactive content behavior into each homepage. I’ve worked as a creative lead here closely co-operating with the designer. We wanted to showcase the dynamic nature of motion blending theatre and performing arts with modern web design. Each homepage was carefully tailored in that sense. The result is a premium WordPress theme featuring smooth parallax scrolling elements, custom content loading animation, and modern hover effects.

  • Dieter - An Authentic Theme for Artists, Designers, and Creative Agencies
    http://dieter.edge-themes.com/landing

    I’ve teamed up with product designer to carefully build on the existing UI characteristics by introducing modern animation. My work here includes UI hover effects and behavior with the focus being the landing page where I've developed a custom hero layout used as loading sequence - editable text and image content with scroll-based interactivity.

  • Sahel - An Elegant Multi-concept Theme
    http://sahel.elated-themes.com/landing

    I've developed page loading sequences, UI hovers, and interactivity with scroll-based loading effects etc. The most eye-catching features would be custom blur in-out hover for portfolio lists, horizontal scrolling portfolio list, dynamic background colors. Honorable mention on Awwwards.

    Featured
    - Horizontal Scrolling List: http://sahel.elated-themes.com/nyiri/
    - Blur/Focus Hover: http://sahel.elated-themes.com/kalahari/
    - Dynamic Background Color: http://sahel.elated-themes.com/danakil/

  • Makoto - A Creative Multipurpose WordPress Theme
    http://makoto.elated-themes.com/landing

    The goal of this project was to make a strong first impression. I’ve developed highly interactive layouts for multiple pages including a split screen slider. The landing page showcases synced content starting with an editable textual loading spinner. The most interesting bits of code are the marquees – both text and image marquee I’ve custom developed to preserve 60fps rendering performance.

    Featured:
    - Split Screen Slider: http://makoto.elated-themes.com/split-screen-slider/
    - Text Marquee http://makoto.elated-themes.com/text-marquee/

  • Orkan - A Portfolio Made for Designers, Artists, and Agencies
    http://orkan.edge-themes.com/landing

    Aiming to keep the distinct design palette from the start, I’ve stayed away from color-based interactivity and went for motion. The highlights of this project are dynamic intro section – loading animation, fullscreen showcase, and Passepartout slider. All of them are fullscreen, scroll-based layouts.

    Featured:
    - Passepartout slider - http://orkan.edge-themes.com/passepartout-slider/
    - Fullscreen showcase slider - http://orkan.edge-themes.com/full-screen-showcase/

  • Aoki - A Bold Multipurpose Creative Theme
    http://aoki.select-themes.com/landing

    The aesthetics of this project are strong, vivid, and urban. To preserve these traits, I’ve custom developed a hero progress loader for a landing page, interactive background-text elements, scroll-triggered intro section and a variety of well-balanced modern hover effects and transitions.

    Featured:
    - Interactive homepage example: http://aoki.select-themes.com/interactive-links/

  • Tonda - A Modern, Elegant WooCommerce Theme
    http://tonda.select-themes.com/landing

    Using a characteristic color palette with mild overtones, the designer introduced a soft and gentle atmosphere that needed a touch of dynamics. I’ve focused on distinct UI behavior with characteristic button animations and subtle hover effects on various elements which combined with longer crossfades between pages preserve the comfortable flow. As always, landing page was carefully tailored from start to finish to showcase theme features including a custom video frame shortcode.

  • Ottar - A Contemporary Portfolio Theme
    http://ottar.edge-themes.com/landing

    A black and white theme with minimal content and delicate photography inspired me for something special. I’ve developed custom cursor behavior along with complementary hover effects to give this theme more character and fluency using distinct page transitions.

  • Highlights From My Other Projects

    - Intro Panels:
    Developed a split-like loading sequence with engaging panels layout featuring dynamic background color and full-screen call-to-action functionality:
    http://brynn.elated-themes.com/landing

    - Modern shop layouts
    Three custom-developed layouts for this shop theme - split tile slider, parallax list, divided list.
    http://bazz.select-themes.com/split-tile-slider/
    http://bazz.select-themes.com/parallax-shop/
    http://bazz.select-themes.com/divided-store/

    - SVG animation
    Custom SVG animations throughout this project with SnapSVG.
    http://blomma.select-themes.com/landing

    - Glitchy Intro
    A two-screen intro section custom developed for theme presentation.
    http://haar.edge-themes.com/landing

    - Uncovering Slider
    A boutique slider layout with a powerful unveiling loading effect fit for multiple homepages:
    http://sarto.edge-themes.com/
    http://sarto.edge-themes.com/agency-home/
    http://sarto.edge-themes.com/design-studio/

    - Horizontal Parallax Slider
    A fullscreen bordered carousel which adds a tailored dose of interactivity to this very stripped-down theme:
    http://fierce.edge-themes.com/stack

  • Build a Custom Full Page Slider with CSS and JavaScript (Publication)
    There are a number of ways of implementing animated full-screen layouts with a large degree of human interaction, and many developers would resort to a JavaScript plugin to save time. In this article, Toptal JavaScript Developer Stefan Vitasovic demonstrates how you can do it using nothing but CSS and JavaScript, without including a bloated library or plugin in your project.

Skills

  • Languages

    JavaScript, SCSS, CSS3, HTML5, ECMAScript (ES6), PHP
  • Libraries/APIs

    Parallax, jQuery, React Redux, GSAP, jQuery UI, React, Barba.js, Mustache, JSON API, REST APIs
  • Paradigms

    Responsive Coding, Object-oriented Programming (OOP)
  • Platforms

    Visual Studio Code, GreenSock Animation Platform (GSAP), WordPress, Windows
  • Other

    PSD to HTML, Scripted Animation (JavaScript), Scroll Animations, Interactive UI, UI Animation, CSS3 Animation, Web Animation, Web UX, Web UI, Interactive Web Design, Interactive Web Development, Ajax, SVG Animation
  • Tools

    Adobe Photoshop, Subversion (SVN), Adobe Experience Design (XD)
  • Storage

    JSON
  • Frameworks

    Bootstrap

Education

  • Master's Degree in Electrical Engineering - Audio and Video Communications
    2013 - 2015
    University of Belgrade - Belgrade, Serbia
  • Bachelor's Degree in Electrical Engineering - Telecommunications and Information Technologies
    2008 - 2013
    University of Belgrade - Belgrade, Serbia

To view more profiles

Join Toptal
Share it with others