注目キーワード

MOONGIFT

OSSを中心としたメディアポータル

タグ「デザイン」の公開予定記事

プレミアムユーザーは以下の記事を先行で購読可能です。MOONGIFTプレミアムは月額500円の有料サービスです。詳細はこちらから

一般公開:2012/02/20
IE8以前に救済。HTML5のタグを利用可能に
一般公開:2012/02/17
Webアプリケーションを作るのに便利そうなコンポーネント群
一般公開:2012/02/17
Webデザイナー向け。CSSを手軽に楽しむ,

プレミアム登録する

タグ「デザイン」の記事一覧

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

Screenshot-2012-01-25-12.25.37_thumb

2012/02/05

Tumblrのテーマをローカルでさくさく作り上げる「Fumblr」

Tumblrにはデザインをカスタマイズする機能がありますが、オンラインで行うには色々修正した後、確認して…という作業を繰り返す必要があります。そこでFumblrを使ってももっと効率的にTumblrのテーマを作成してみましょう。 インストールします。必要なライブラリはbundleでインストール...

Screenshot-2012-01-23-15.21.30_thumb

2012/02/02

Facebook風ボタンをCSS3でデザイン「CSS3 Facebook Buttons」

最近はFacebookアプリの開発も増えてきました。そんな開発の際に使えそうなのがCSS3 Facebook Buttons、Facebook風ボタンをCSS3で作成したソフトウェアです。 色は3種類から選択できるようです。 classを指定するだけ。使い方は簡単です。 サイズが少し大きいバ...

Screenshot_2011_12_26_12_16_15_thumb

2012/01/04

Metro UIをiOS/Androidに移植「TiMetro」

Windows Phoneが渾身の力をこめて投入してきたUIがMetroです。確かにすっきりとした格好いいインタフェースになっています。そんなMetro UIをTitaniumを使って再現したのがTiMetroになります。 最初にパネルが並んで表示されます。 パネルを選択するとアイテムが一覧...

Screenshot2011-12-21-16.23.27_thumb

2011/12/31

マルチプラットフォームで動作するLESS専用エディター「Crunch!」

CSSの煩わしさから解放してくれる記法が幾つかありますが、今回取り上げるのはLESSです。そしてCrunch!はLESSファイルを編集するためのエディタで、CSSへのコンパイル機能を備えています。 インストールです。Adobe AIRが必要です。 インストール自体はウィザードで進められます。...

Screenshot2011-12-19-14.27.10_thumb

2011/12/28

高度な表現力を実現したJavaScriptフレームワーク「toxiclibs.js」

コンピュータでプログラミングされたデザインを描き出すフレームワークにProcessingを用いたtoxiclibsがあります。それはJavaで開発されているのですが、何とJavaScriptにポートしたプロジェクトが登場しました。それがtoxiclibs.jsです。 デモを実際に試した動画で...

7032e697f4bd265436734687fb3d0000

2011/12/17

ヘッダーとフッターを常時表示するjQueryライブラリ「Keep-in-View」

最近のWebサイトではヘッダーがスクロールしても常に表示され続けるUIが人気です。同様にフッターも表示し続ける、そんなjQueryプラグインがKeep-in-Viewです。 最初の表示です。ヘッダーとフッターに注目です。 一番下までスクロールしました。ヘッダーが残っています。 途中までのスク...

Screenshot2011-11-25-10.58.46_thumb

2011/12/03

CSS3を使った高度なアニメーションライブラリ「Animate.css」

Animate.cssはCSS3を使ってアニメーションを実現するライブラリです。何はともあれ、デモ動画を見て何が実現できるのか知ってください。 トップページです。ここの各ボタンを押すとアニメーションが実行されます。 デモ動画です。 Animate.cssの特徴としてはjQueryのようなJa...

76d15feadf794256ea8cbdfb8c1524f8

2011/11/12

Webデザイナーにお勧め!LESSファイルを監視してCSSに自動変換「SimpLESS」

CSSで不満に感じられることの多い、入れ子の構造や変数定義などを可能にするCSSライブラリがLESSです。そんなLESSファイルの作成、更新を監視してCSSファイルを自動生成してくれるソフトウェアがSimpLESSです。 最初に起動したときの画面です。SimpLESSはTitaniumを使っ...

111028-0004_thumb

2011/11/07

Webデザイナーにオススメ!SCSS/Sassで記述してリアルタイムに変換、デザインを確認「Compass」

実行しているところです。メニューバーに常駐します。 設定です。SCSSまたはSassに対応し、自動で短縮化もしてくれます。 通知機能があります。Mac OSXの場合はGrowlで通知してくれます。 Webサーバ機能とlivereload機能があります。保存したタイミングで任意のポートをたたい...

Screenshot2011-10-28-9.45.40_thumb

2011/11/06

チュートリアル付き!iOS風ホーム画面をWebブラウザ上に再現「iOS-like Home Screen」

優れたWebデザインを見ると心が躍ってしまいます。しかしどうやって作ったものか分からないくらい複雑だとただ見ているだけで終わってしまうでしょう。iOS-like Home Screenは違います。デザインが優れているのはもちろんのこと、その作り方も教えてくれます。 まさにiOS風!背景も格好...

Screenshot2011-10-27-16.58.50_thumb

2011/11/04

Bootstrapライクに使えるWebデザインテンプレート「Zurb Foundation」

一定の記法に則って書くだけで様々なデバイスに対応したWebデザインを行ってくれるのがZurb Foundationです。Zurb Foundationを使って格好いいWebサイトを量産しましょう! ボタンです。ただ普通に書くだけでこんなデザインに。 フォームです。エラー時も含めて格好いいです...

Screenshot2011-10-27-16.40.20_thumb

2011/11/03

Web上でもフォント指定を推進!どのフォントが使われているか調べてみよう「WhatFont Tool」

Webサイトではあまりフォント指定が行われていません。それはローカルにフォントがあるかどうか分からないためです。しかしWebフォントを使えば問題はある程度解決します。そこでWebフォントが使われている現場でのフォントチェックに使えるのがWhatFont Toolです。 アイコンクリックで起動...

110920-0001_thumb

2011/10/09

任意の場所の色情報を簡単にピックアップ「Color Picker Pro」

Color Picker ProはMac OSX用のオープンソース・ソフトウェア。Webサイトのデザインや画像編集を行っている時に、目の前に表示されている色の情報が欲しいと思うことが多々ある。それは画像編集ソフトウェア内ではなく、Webブラウザで表示しているものや別なアプリケーションのものだ...

Screenshot2011-09-26-14.38.30_thumb

2011/10/07

Wikipediaの可読性を大幅にアップするSafari機能拡張「Beautipedia」

BeautipediaはSafari機能拡張のフリーウェア(ソースコードは公開されている)。Wikipediaのコンテンツは見ていて飽きない。リンクを辿っていけば新しい未知の知識がそこに存在する。どんどんクリックしていくうちに全体としての概要が把握できたりする。とても素敵なWebサービスだ。...

Screenshot2011-09-21-10.14.17_thumb

2011/10/03

まさに色の魔術師。色をもっと楽しめる「Color Jizz」

Color JizzはJavaScript/PHP/ActionScript3/.NET用のオープンソース・ソフトウェア。色はとても不思議だ。その色合い次第で同じ情報でも受け取る印象が全く変わってくる。色の特性や感性を理解し、使いこなせる人はとても凄い。 公式サイトのサンプルより とは言え、...

Screenshot2011-09-18-10.42.56_thumb

2011/09/27

多彩なウィジェットで高品質なWebアプリケーションを素早く構築「Kendo UI」

Kendo UIはHTML5/CSS3/JavaScript製のオープンソース・ソフトウェア。WebのUIは表現力がとても高く、自由度が高い。それは良いことでもあるし、悪いことでもある。束縛が何もないために自由に発想できる反面、デザインする才能がないと情報が散らばってしまってどうにもならなく...

Screenshot2011-09-12-9.48.14_thumb

2011/09/22

NetBeans上でSCSSを使いやすく「SCSS Editor」

SCSS EditorはNetBeans用のオープンソース・ソフトウェア。最近JavaScript界隈で人気が集まっているのがCoffeeScriptだ。Railsでは3.1から正式採用されると言われており、Titaniumの開発でも利用できる。JavaScriptで物足りなく感じていた所を...

Screenshot2011-09-09-14.43.52_thumb

2011/09/19

Fireworksを使ってiPhoneアプリのモックデザインを行う際に「iPhone GUI Fireworks Symbols」

iPhone GUI Fireworks SymbolsはFireworks用のオープンソース・ソフトウェア。iPhoneアプリはWebサイト以上にデザインが正否を左右する。どれだけ機能的に面白かろうと、デザインがいけてなかったら誰も使ってくれない。またボタンの配置やデザインで評価がはっきり...

Screenshot2011-08-22-9.59.45_thumb

2011/09/01

これがあればWebアプリケーションのデザインがすいすいできる「Bootstrap」

BootstrapはCSS製のオープンソース・ソフトウェア。ITエンジニアが苦手にするのがWebデザインだ。作るのは良いが、それを奇麗に配置していくのがとても難しい。Webサービスが流行るか否かに技術が及ぼす影響は良くて半分だろう。残りの半分以上は見た目にかかっている。 グリッド それもあっ...

Screenshot2011-08-12-11.19.35_thumb

2011/08/27

Web上でビジュアル的にWordPressのテーマを作成できる「PressWork」

PressWorkはPHP/WordPress用のオープンソース・ソフトウェア。単なるブログエンジン、単なるCMSという枠を越えつつあるWordPress。新規サイトを構築する際に一から作るのではなくWordPressのテーマを作ったり、プラグインを使って構築するケースも多い。もはやプラット...

新規購読
新規購読

プレミアムでしか読めない記事が159あります。ぜひ登録を!

  • オープンブロックス - OpenBlockS
  • 広告募集

ぷらっとオンラインおすすめ商品もっと見る

もっと見る

人気記事もっと見る