コードドックを利用するうえで、あなたが準備すべきものはレイアウト画像です。 図形ツールを使用し、直感的にレイアウトの下書きを作ります。レイアウトを組み終えたら、コードドックに読み込ませ、htmlへと変換します。
入力
出力
ユーザーが手書きやデザインツールで作成したレイアウトの下書き画像をアップロードすると、コードドックが自動的にHTML/CSSを生成し、直感的なエディター上でリアルタイムに編集や調整が可能になります。ドラッグ＆ドロップでレイアウトを変更したり、スライダーやカラーピッカーを使ってデザインをカスタマイズできるほか、テキストや画像の編集も簡単に行えます。また、スマホ・タブレット・PCといった異なるデバイスでのプレビュー機能を備え、レスポンシブデザインにも対応。最終的には、生成されたコードをダウンロードしたり、ワンクリックでサーバーにデプロイしたり、WordPressなどのCMS向けにエクスポートすることも可能で、コーディング未経験者でも簡単にWebサイトを構築でき、経験者にとっては作業の効率化を実現するWeb制作補助ツール。