Webロケッツマガジン

  • HOME
  • ABOUT
  • CONTACT US

Webデザイナー、Webプログラマー向けに最新のロケットを発射するマガジン

デザインインスピレーション:ゲーム性をインターフェースに取り入れたサイト

  • Posted : 2012-01-19 14:47:04 by namba
  • サイト集
  • このエントリーをはてなブックマークに追加
  • 共有
デザインインスピレーション:ゲーム性をインターフェースに取り入れたサイト

ゲームというのは不思議なもので、僕らゲーム世代はゲームと聞くと論理不要でついついやってしまいますよね!。この記事では、そんなゲーム的な要素をインターフェースに取り入れているサイトを紹介したいと思います。 記事を読む

個人でWebサービスを発想する時に参考になるかもしれない「視点を変える方法」を考えてみた

  • Posted : 2012-01-17 12:02:46 by namba
  • Webサービス
  • このエントリーをはてなブックマークに追加
  • 共有
個人でWebサービスを発想する時に参考になるかもしれない「視点を変える方法」を考えてみた

「来年こそ、Webサービスを作ってやろう!」と考えているけれど、何を作ったらいいのかわからない... という人のために、新たなWebサービスを考える時に使えそうな「視点を変える方法」をいくつか考えてみました。 記事を読む

CSSでリンク下の点線をマーキーツールのようにアニメーションさせる

  • Posted : 2012-01-14 09:55:54 by namba
  • CSS
  • このエントリーをはてなブックマークに追加
  • 共有
CSSでリンク下の点線をマーキーツールのようにアニメーションさせる

マーキーとは、Photoshop とかで、範囲選択したときに表示されるあの点線みたいなヤツです。PARK LA FUN というサイトで、これを見かけて面白いなと思ったので、作り方を紹介します。 記事を読む

CSS3で線(border)をグラデーションさせるテクニック

  • Posted : 2012-01-12 12:16:43 by namba
  • CSS3
  • このエントリーをはてなブックマークに追加
  • 共有
CSS3で線(border)をグラデーションさせるテクニック

CSS3で線のグラデーションができないかと考え、Illustrator とかでよくやる「塗りとパスのオフセットを使って実現する線のグラデーション」を、CSS3で実験してみました。 記事を読む

表示中のWebページのCSS3スタイルをビジュアルに編集できるchrome拡張:Code Cola

  • Posted : 2012-01-11 12:36:02 by namba
  • CSS3Chrome
  • このエントリーをはてなブックマークに追加
  • 共有
表示中のWebページのCSS3スタイルをビジュアルに編集できるchrome拡張:Code Cola

表示中のWebページのスタイルシートを Illustrator のようなビジュアルな UI で、ブラウザから変更できる chrome 拡張、Code Cola を紹介します。 記事を読む

CSS3でスティッチ(縫い目)のような効果を作るアイディア

  • Posted : 2012-01-10 21:21:10 by namba
  • CSS3
  • このエントリーをはてなブックマークに追加
  • 共有
CSS3でスティッチ(縫い目)のような効果を作るアイディア

「HOW TO CREATE STITCHED LOOK IN CSS」より、CSS3でスティッチ風に飾ったボタンを作る方法を紹介します。 記事を読む

Happy New Year! - 新年のあいさつと抱負

  • Posted : 2012-01-06 13:25:53 by namba
  • このエントリーをはてなブックマークに追加
  • 共有
Happy New Year! - 新年のあいさつと抱負

遅くなりましたが、あけましておめでとうございます。なんとか新年を迎えることができたWebロケッツマガジンの今年の抱負です。 記事を読む

jQueryで塗りがアニメーションするようなギミックを作る

  • Posted : 2011-12-27 11:25:29 by namba
  • jQuery
  • このエントリーをはてなブックマークに追加
  • 共有
jQueryで塗りがアニメーションするようなギミックを作る

Flashでよくやっていた表現で、jQueryで置き換えられるものはないかと考えていて、ふとマスクを思いついたので紹介します。応用次第ですので、アイディアのネタとして見てください。 記事を読む

インスピレーションのためのサイトリーディング:Slavery Footprint

  • Posted : 2011-12-26 20:52:25 by namba
  • サイト集
  • このエントリーをはてなブックマークに追加
  • 共有
インスピレーションのためのサイトリーディング:Slavery Footprint

インスピレーションのためのサイトリーディングということで、不定期で私が「これは!すばらしい」と思ったサイトをその概観だけではなく、もう少し掘り下げて読んでみようという記事です。 記事を読む

jQueryでメニューのアンダーラインがアニメーションするギミックを作る

  • Posted : 2011-12-23 14:32:58 by namba
  • jQuery
  • このエントリーをはてなブックマークに追加
  • 共有
jQueryでメニューのアンダーラインがアニメーションするギミックを作る

この記事では、メニュー下のラインがマウスを追いかけるようにアニメーションするギミックをjQueryで実現する方法を紹介します。言葉ではうまく説明できないので、本文のサンプルを見てください。 記事を読む

次の記事へ
  • Ad here

HOT ROCKETS 最新のロケット

  • CSS3を使ってできる画像まわりのエフェクトやスタイリング1813年前
  • 提案や設計資料に使える!かわいめアイコン素材を60種類作ってみました(ビジネス編)13年前
  • CSS3を極めたいなら知っておきたい三角形を作る3つの方法13年前
  • “MS Pゴシック” をメイリオみたいにアンチエイリアスさせるCSS3ハック13年前
  • CSS3でボックスの角にベベル(丸くないborder-radius)をかける方法13年前

POPULAR ROCKETS 人気のロケット

TAGS すべてのタグ

  • Chrome
  • CSS
  • CSS3
  • Firefox
  • HTML5
  • JavaScript
  • jQuery
  • PHP
  • UI
  • Webサービス
  • アイコン
  • カラー
  • サイト集
  • サービス
  • スマートフォン
  • ソーシャル
  • ハック

SMARTPHONE スマートフォン

スマートフォン

スマートフォンからも最新のロケットをチェックできます。同じURLからアクセスできます。 webrocketsmagazine.com

SUBSCRIBE US 記事をチェック

基本、毎日記事を書いています。よかったらチェックしてください。

  • RSS
  • facebook
  • Twitter

RECOMMEND BOOKS お勧め本 -PR-

MdN (エムディエヌ) 2012年 03月号

腕のいいデザイン事務所で修業しないとふつうは身につかない知識と技と心得 / 付属CD-ROMに「繊細な鉛筆画風イラスト」のデザイナーズ素材が入ってます

MdN (エムディエヌ) 2012年 02月号

今月のMdNは豪華2大特典の新年スペシャル号! / 400個のデザイナーズ素材で実践! / 素材を最大限に活かすデザインアイデア50