R4

Webサービス レビュー * R4  

4種のUI要素を作成・ソースをDLできるツール「Ui Parade – Live Tools」

2012年9月18日 Tag:webサイト制作 Text by 上瀧

このエントリーをはてなブックマークに追加

ボタン、フォーム、アイコン、リボンの4つのUI要素をテンプレートから作成し、HTML、CSSソースをその場でダウンロード出来るサイト「Ui Parade – Live Tools」のご紹介です。

このサイトは、高品質なUI要素を集めたショーケースサイト「Ui Parade」が展開するツールです。

Live Toolsのトップページにあるボタン、フォーム、アイコン、リボンの中から作りたいUI要素を選択できます。

ひとつずつ簡単にご説明します。
ボタンビルダーでは、テンプレートからラベルのフォント・角丸のサイズなどの選択ができます。

通常時、ホバー時、クリック時のボタン・テキストの色もこの場で指定可能です。
右下の赤いボタンをクリックすると、HTMLまたはCSSのソースが表示されます。

フォームビルダーでは、ボタン要素は上記のボタンビルダーの指定が可能な他、背景、テキストフィールドのデザインが指定可能です。

アイコンビルダーでは、オリジナルで絵を描くか、ギャラリーや既存データを元にアイコンの作成が可能です。
画面右上にボタンやメニュー、ファビコンなどの表示を想定したプレビューが表示ができます。

最後はリボンビルダーです。こちらも全てHTML、CSSで出力可能です。
リボンのサイズ、スティッチの有り/無しなどが指定可能です。

ざっとご紹介しましたが、4つそれぞれのビルダーに特長があり、触り比べてみるだけでもおもしろいです。各UIの背景色などもその場で変更、プレビューが可能なのでより実戦向きのツールのように感じます。

手軽に試せるので、気になった方はぜひ触ってみてください。

Webサイト:Ui Parade – Live Tools

Latest

Pickup

Category

koyomi

4db

Twitter