Macaw

コードを書くのをやめ、描画でデザインを始めましょう。Macaw はお気に入りの画像編集ソフトと同等の柔軟性を提供するだけでなく、意味のある HTML と極めて簡潔な CSS も自動生成します。ウェブデザインツールにもっと高い機能を求められる時代が来ました。

フリュイド・キャンバスとグリッド：Macaw はフリュイド幅（レスポンシブ幅）向けに設計されています。キャンバスのサイズを変更すると、グリッドや要素もそれに応じて自動的に更新されます。

レスポンシブ・ブレークポイント：異なるデバイスサイズ向けのデザインは難しい作業です。Macaw では任意のブレークポイントを定義でき、その特定の幅に対してプロパティを微調整できます。

豊かなタイポグラフィ：Macaw ではシステムフォント、豊富なウェブフォントライブラリ、さらには Typekit フォントへのアクセスも可能です。また、「1 行あたりの文字数」などの実用的な計算機能も提供します。

インタラクティビティ：Macaw では、クリック可能なプロトタイプの作成が、ターゲットをクリックするだけというほど簡単です。しかし、それだけではありません。スクリプトパレットを使えば、さらにダイナミックなインタラクションを追加できます。Macaw はテンプレートや jQuery 変数も自動生成してくれます。

少ない作業で、より多くをデザイン：グローバルスタイル — Macaw では共通のスタイルを保存しておき、ドキュメント内の任意の要素に素早く適用できます。適用後はスタイルエディタから一度にすべての要素を一括更新できます。

再利用可能なコンポーネントとアセット：複雑な要素を複数ページで使い回したい場合、Macaw ではそれをライブラリに「コンポーネント」として保存し、プロジェクト内の任意のページにドラッグ＆ドロップできます。

新機能（バージョン 1.5）：

リッチテキスト編集：テキスト要素内で span、anchor（リンク）、em、strong タグノードを追加し、個別にスタイル設定できるようになりました。これらのリッチテキストスタイルはレスポンシブ対応であり、状態（state）にも対応しています。使い始めるには、まずテキスト要素の編集を開始 → 文字を選択 → ノードを追加 → スタイルを適用してください。

状態（States）：各要素に対して hover、focus、active の状態を定義できるようになりました。公開時に Macaw がスタイルを自動統合し、CSS をすっきりと整理します。

表示切り替え（Display Toggling）：Macaw では、要素の display および visibility を切り替えられるようになりました。これらの設定はブレークポイントごとに個別に変更可能です。