Design—Code—Repeat

Wassim Chegham

 

https://wassim.dev

once upon a time...

IDEA

PRODUCT

CODE

PROTOTYPE

SPEC

WIREFRAME

VISUAL DESIGN

most design—code workflows are broken.

implementing the design can be tedious.

updating the design breaks the code.

it costs—a lot of—money!

how can we fix this?

a tool that generates code from a design.

it is a hard task—

Model Driven Architecture!

and Adobe Flash Builder?

remember Adobe Dreamweaver,

many great tools have tried/are trying to fix this.

many of them—if not all—are not free.

many of them—if not all—are close source.

some of them are not cross platform.

many of them integrates with paid UI softwares.

some don't address frameworks characteristics!

introducing...

xLayers tries to bridge the gap between designers and developers.

CODE

VISUAL DESIGN

xLayers

xLayers is an online code generator service.

xLayers is not a UI designer tool!

xLayers converts SketchApp* design to ANY code!

* Support of other UI design tools is on our radar.

xLayers is fully open source.

xLayers is community driven.

xLayers core & contributors

a huge thank you to our sponsors

support us on OpenCollective.

Centigrade GmbH

Supported frameworks

LitElement

xLayers (long-term) goals

support shareable links

add more frameworks

externalize the codegen API

add a REST API for batch processing

support more UI design tools!

VSCode and SketchApp plugin

xLayers DSL

xlayers.design

github.com/xlayers/xlayers

Design—Code—Repeat

By Wassim Chegham

Design—Code—Repeat

Bridging the gap between designer and developers.

  • 146
Loading comments...

More from Wassim Chegham