A freelance product design chief, Visual artist, and coder based in Lisbon.
I craft tools for code people and help product teams chain their creative efforts into long-lasting strategies.

I have been fortunate to work with:

Testimonials

"...I can recommend Avin for any type of digital design project, especially ones that are difficult to crack and require good conceptual understanding and original, out of the box thinking."

Nitzan Volman, Head of Taboola Labs at Taboola

"Avin developed our Product Design System, which helped us revamp our products and have a better alignment across the offering... He always does things professionally, creatively, and with enthusiasm."

Itay Levin, Design lead at HCL AppScan

“I have referred other colleagues of mine to Avin, and intend to keep working with him in the future.”

Guy Atzmon, VP Creative, SundaySky

"Avin is very creative, an expert in his field, and fun to work with. I would highly recommend working with him.”

Yair Greenbaum, Akami Technologies

Product Design

HCL AppScan Design System

  • AppScan on Cloud and AppScan Standard

    Design System for a Cross-Platform AppSec tools offering

    HCL AppScan is a leading Application Security Testing tool offering, runniingacross multiple platforms and serving wide range of needs. Their Design System Supports consistency across SaaS, Windows, and various IDE plugins, leveraging the advantages of each environment.

  • Lean, maintainable, component library (core with platform-dedicated branch-outs)

    Consistent UI across platforms, based on a lean core library of both interaction and content patterns, branching to different tiers of web, Native OSs and 3rd party plugins.

  • Security rules panel close-up (AppScan CodeSweep))

    UI consistency was achieved by keeping unified Information Architecture and Content Patterns, yet adapting to the visual guidelines of the environments each product is running on.

    Supporting consistency across SaaS, Native Windows apps, and various IDE plugins, managing the advantages of each environment and the differences between them around unified content patterns and Information Architecture

  • AppScan CodeSweep IDE Plugin

    AppScan CodeSweep IDE Plugin in VSCode environment

    a developer-focused static application security testing (SAST) tool. CodeSweep provides on-the-fly security testing, auto-fix capabilities and support for over 30+ languages/frameworks.

  • AppScan Standard (Windows Native environment))

    AppScan Standard (Windows Native environment))

    Dynamic application security testing (DAST) solution is designed for security experts and pen testers to use when performing security tests on web applications and web API.

  • HCL AppScan On Cloud (Web environment))

    HCL AppScan On Cloud (Web environment))

    Comprehensive Cloud-based Application Security Testing Suite, offering Static, dynamic, interactive, and open-source application security testing – all in one place.

  • Re-positioning for each tool as part of the offering

    As part of the project, each of the main offering tools required precise repositioning, showing its advantage against competitions, as well as the value it delivers to the greater offering.

  • base module for the new set of app icons

    a New visual system around a mature AppSec brand

    Re-positioning and re-designing the main offering products, each as both a powerful part of a wider offering, as well as an advantage in the face of its symmetrical competitors in the market.

  • 5 Main Offering's tools

    5 Main Offering's tools: AppScan Standard, AppScan Go!, AppScan Source, appScan Enterprise and AppScan on Cloud.

    Distinctive app icons for the main tools in the offering, to position each of them both within the offering and against competition.

Zerto Mobile app ( iOS | Android ):

  • Main view (Dashboard)

    Zerto provides disaster recovery and business continuity software for enterprise class companies. I helped them designing their monitoring mobile apps and start their mobile patterns library.

  • VPGs list (System assets)

  • Alerts view

  • Splash screen

SAST Retrospective tool

  • Internal tool used by a security team. Browser-based, Desktop only.

    SAST code scan is an expensive process, mapping vulnerabilities through entire code data flows. This internal tool uses to analyze a scan’s outcomes, and improve the organization’s scans routine.

  • General view (findings and detection process))

  • Focus view on selected data

  • Filtering mechanisms

Creative Coding

Controling GLSL shaders with CSS

See the Pen CSS-to-GLSL by Avin Vadas (@avinvadas) on CodePen.

This case study contains a walk through with takeaways on both design and dev aspects, along with live-coded samples for experimentation.
To Experiment with the embedded pen:

1. Go to Codepen,
2. Fork a version of the pen, so you can edit and save
3. Change the values of CSS vars under ‘MAIN CSS VARS FOR UPDATE:‘ comment (Colors, etc.)
4. Save the pen and Refresh the page to see the results.

Photo by Joakim Nådell on Unsplash

Articles

a Design System is also about products that don’t adopt it. Read article.

Set nested 3D assets to respond to UI updates

Beyond consistency, a design system is also a facilitator of change

The underlying design split we often overlook

Content patterns can take us a long way.

Mental Models talk at Startup Lisboa

Public speaking

Mental Models talk at Startup Lisboa

Mental-Models and Journey maps are significant, live layers to base on when planning a design infrastructure, apart from their essential basics for studying the people who use our products.
This short talk is about the what, the why, and a tiny bit of the how.

Visual Art

Light Documentations

Drawings from observation 2014-24, Online exhibition.

Unpackaging

Graphic novel, Coming soon.