TOP  >  ヒップスタースタイル

Tag : ヒップスタースタイル

過去の記事からランダムで表示

2007年11月19日

HTMLを崩壊させるJavascript「meltdown.js」

今回は少し変わったJavaスクリプト「meltdown.js」を紹介したいと思います。このJavaスクリプトはHTMLを崩して崩壊させてしまうと言うスクリプト。

このスクリプトを使うとページがアニメーションしながらガラガラと崩壊していきます。スクリプトはブックマークレットや特定のURLをアドレスバーに貼付けるだけで作動します。おもしろそうなので実際に試したものをスクリーンキャストで撮ってみました。

動画は以下から

(さらに…)

続きを読む
posted 02:06  |  
Category: WebDesign   
2008年11月09日

美しいアイコンセットを集めた「40+ Extremely Beautiful Icon Sets」

デスクトップからインターフェイス、WEBデザインまで様々な用途で使えるアイコン。そんなアイコンをまとめたエントリーが今回紹介する「40+ Extremely Beautiful Icon Sets Hand-picked from deviantART」です。このサイトはあらゆるジャンルのクリエイター達のコミュニティ「deviantART」からピックアップしてきたものだそうです。


Aeon

管理者さんが直接ピックアップしているみたいなので、好みがでていて立体的なアイコンが多いです。今日はその中から気になったアイコンをいくつか紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 12:41  |  
Category: WebDesign   
tag: webdesign
2018年06月09日

UIデザインやWebデザインに役立つフリーのhtml UIキット「25 Fresh Free HTML UI Kits」

Webやアプリケーションのデザインに欠かせないUI設計。しかし使いやすく最適なUIデザインを一から考えるのは中々手間がかかるもの。今回ご紹介するのはそんなデザイナーの方におすすめしたい、最新のUIデザインキット「25 Fresh Free HTML UI Kits」です。

html0609
GitHub – ElemeFE/element: A Vue.js 2.0 UI Toolkit for Web

CSSやHTMLの知識が必要にはなりますが、使いやすく多彩なシーンで活躍できるUIデザインキット25種類が紹介されています。さらにその中から幾つかおすすめのUIキットをピックアップしてみましたのでご覧ください。

詳しくは以下
(さらに…)

続きを読む
posted 09:00  |  
Category: WebDesign   
2011年05月03日

webサイトのボタンデザインに重要な7つの要素「Common elements used in interface button design」

webサイトを制作する際、全体的なデザインの決定も重要ですが、サイト内を自由に動くための動線をしっかりと設計することが、ユーザーを引きつける為にも必要ではないでしょうか?そこで今回は、それぞれのページのドアとなるボタンのデザインに重要な7つの要素を解説した「Common elements used in interface button design」を紹介したいと思います。


Dribbble – Upload button by kailoon

的確な解説、さらに実制作に役立つチュートリアも紹介されているので、すぐにボタン作りに活かすことができそうです。

詳しくは以下

(さらに…)

続きを読む
2009年12月09日

商用可!ベクターで利用できるフリークリスマスアイコンセット「Free Smashing Christmas Icon Set」

季節的にすっかり街はクリスマスムードで、街にはクリスマスにまつわるものが溢れていますが、今日紹介するのはオーナメントやツリー、雪だるまなどなど、クリスマスの定番のモチーフをアイコンセットにした「Free Smashing Christmas Icon Set」です。

smashing_cris01

こちらのアイコンセットはベクターデータで配布されており、自由に大きさやカタチ、色などをカスタマイズすることができます。収録されているアイコンは以下の通りです。

詳しくは以下

(さらに…)

続きを読む
posted 09:52  |  
Category: Design , vector   
tag: Design vector
2018年02月17日

CSSとSVGで作るアイコンセット「Let’s make multi-colored icons」

Webサイト内でよく見かけるアイコンですが、みなさんはどのように制作しているでしょうか。IllustratorやPhotoshopを使い、JPEGやPNG形式で保存している方も多いかと思いますが、今回紹介するのは、CSSとSVGで作るアイコンセット「Let’s make multi-colored icons」です。

SVG_CSS_icon02

SVGのメリットを活用したアイコンの生成方法が分かりやすく解説されています。

詳しくは以下

(さらに…)

続きを読む
posted 10:30  |  
Category: WebDesign   
2008年08月18日

実用的なCSSテーブルデザイン集「Top 10 CSS Table Designs」

テーブルと言えば、今やあまり使われなくなった感じがしますが、それでも何かを比較したり、情報を整理したりといった用途には非常に便利に使えます。今日紹介する「Top 10 CSS Table Designs」はCSSでデザインされた、使いやすいシンプルなテーブルサンプルが多数収録されているエントリーです。

いくつか公開されていますが、その中から気になったテーブルデザインをピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 04:24  |  
Category: vector , WebService   
tag: CSS webdesign
2009年03月17日

簡単に作りたい人の為の名刺のベクターデータ「12 Free Vector Business Cards」

ビジネスの上で重要なツールの一つ名刺。それゆえにこだわっている方も多いかと思いますが、逆に沢山配るものなので、簡単に作れれば良いとお考えの方も多いかと思います。今日紹介するのはクリエイティブな名刺を簡単に作成できる名刺のベクターデータ素材を配信している「12 Free Vector Business Cards」を紹介したいと思います。

meishivector

配信されている名刺は全部で12種類で、どちらかというと色鮮やかなものが多く、印象的なデザインが中心です。

詳しくは以下

(さらに…)

続きを読む
posted 04:22  |  
Category: Design , vector   
tag: Design vector
2014年11月01日

600種の豊富なベクターシルエット素材「Free download: 600+ free vector silhouettes」

いろいろなデザインシーンで便利に活用できるベクターのシルエット素材。さまざまな種類をストックしておくといざという時に活躍してくれます。そんな中今回紹介するのは、600種の豊富なベクターシルエット素材「Free download: 600+ free vector silhouettes」です。

600vector1

人間はもちろん、動物、乗り物など、種類豊富にさまざまなポーズのベクターシルエットがセットでダウンロードできるようになっています。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: vector   
2008年02月16日

プレビューしながらテキストのCSSスタイルを簡単に設定できる「CSS Type Set」

CSSに慣れてくるとコードを見ただけでだいたいどんなように見えるかわかったり、その逆で、こんな風に見せたいと思ったことをコードにすることもできると思いますが、覚え立ての頃はそうは行きません。今回紹介する「CSS Type Set」は実際反映された後のデザインのプレビューとCSSのコードを同時に見ながら設定できるWEBサービスです。

CSSテキストスタイルジェネレーター

見た目をプレビューしながらテキストのスタイルを決めていけるので。自分の理想に近づけることも簡単で、横にCSSのコードが表示されているので、その見た目を自分のサイトに簡単に反映させることもできます。

詳しくは以下

(さらに…)

続きを読む
posted 07:59  |  
Category: WebDesign , WebService   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る