手描きの絵からHTMLコードを作ってくれる「Sketch 2 Code」

AIを活用した便利なツールがありました。

Webページのデザインを手描きで下書きして、それをHTMLコードに自動で変換してくれる「Sketch 2 Code」というツールです。

Microsoftが、AzureのAIサービスの活用例として公開しているみたいです。

https://sketch2code.azurewebsites.net/

（参考）以下のページでSketch2Codeが紹介されていました。

note.mu

togetter.com

GitHubでSketch2Codeのコードが公開されています。

github.com

こんなかんじで動作するみたいです。

"Sketch2Code: Turn whiteboard sketches to working code": https://t.co/9P2vuoskxR pic.twitter.com/LcqESSTw9e

— samim (@samim) August 29, 2018

吐き出すHTMLコードは、Bootstrapを使ったもの。

簡単なプロトタイプ（試作品）なら、これで十分ですね？

ラフな手描きの下書きを清書してくれるのもありがたいですが、Illustratorなどでカッチリ描いた下絵を正確にパースしてくれるともっとありがたいですねｗ

Microsoftが「Sketch 2 Code」を公開！AIが、手書きのワイヤーフレームをHTMLに自動変換してくれる新時代に。これはすごい！！｜榊原昌彦｜note

これじゃなくて「手書きのスケッチ」じゃなくてSketchファイルから自動でちゃんとしたHTMLにしてくれるのが欲しい。

2018/09/02 00:24

b.hatena.ne.jp

Microsoftが「Sketch 2 Code」を公開！AIが、手書きのワイヤーフレームをHTMLに自動変換してくれる新時代に。これはすごい！！｜榊原昌彦｜note

• [html]
• [web]
• [development]
• [service]

手描きじゃない（それこそSketchから出力したような）画像からどれだけ作れるか気になる

2018/09/02 05:21

b.hatena.ne.jp

多分そのうち、できるかも！？

AIを活用した便利なツールがどんどん登場してくるような気がしますｗ　d(^^)b

Cognitive Services入門 マイクロソフト人工知能APIの使い方