TOP  >  WEBサイト

Tag : WEBサイト

2018年11月01日

すべてがドットで作られたwebサイト「MODALZ MODALZ MODALZ」

webデザインにはさまざまなテイストがあり、その中で個性を演出していくことは、意外に難しいもの。そんな中今回は、ひと目見たら忘れられないようなwebサイトデザイン「MODALZ MODALZ MODALZ」を紹介したいと思います。

dot

すべての要素がドットで作られた、懐かしささとアナログさが逆に新鮮なサイトデザインとなっています。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:00  |  
Category: Design   
このエントリーをはてなブックマークに追加
2018年07月18日

デザイナーのための フリーAdobe XD用UIキット20種「20 Free Adobe XD UI Kits for Web & Mobile App Designers」

数年前まで、UIデザインはPhotoshopとSketchを中心に行われていましたが、2017年に正式リリースをしたAdode XDが着実にアップデートを重ね、新たなUIデザインツールとして頭角を表してきています。今回は、WEBやUIデザインに役立つ、Adobe XDのUIキットを20種をまとめた「20 Free Adobe XD UI Kits for Web & Mobile App Designers」をご紹介します。

adobexd_ui_05
Free Adobe XD Collaboration App by Edwin Delgado – Dribbble

どのキットも、無料で利用できるので、チェックしておくと重宝してくれそうです。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:00  |  
Category: Design   
このエントリーをはてなブックマークに追加
2017年09月17日

時短やデザインの幅を広げたい時に便利なWebデザインテンプレートまとめ「40 Free Web Page Templates in Photoshop PSD」

いつもと違うデザインに挑戦したい時や工数のかけられない案件などに、便利なのがWebデザインテンプレート。他人の作ったデータをベースにすることで時短や、デザインの勉強にも繋がります。そんな中、今回ご紹介するのは、フリーのWebデザインテンプレートをまとめた「40 Free Web Page Templates in Photoshop PSD」です。

40-free-web-page-templates
Pasco: A free PSD multipurpose template – Freebiesbug

全てPSDデータで制作されたデータが全部で40種類まとめられています。その中から気になったものをいくつかピックアップしてまとめましたので、以下よりご覧ください。

詳しくは以下
(続きを読む…)

続きを読む
このエントリーをはてなブックマークに追加
2016年04月15日

軽量でクリエイティブなツールチップjs「POPPER.JS」

補足やアクセントなど色々なシーンで使えるツールチップ。今回紹介するのは様々な動きの制御が簡単にできる、軽量でクリエイティブなツールチップjs「POPPER.JS」です。

popper01

javascript自体は3.5KBと非常に軽量で、実装方法もjavascriptに普段触れている人であれば簡単に制御が可能です。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:48  |  
Category: javascript , WebDesign   
このエントリーをはてなブックマークに追加
2016年04月13日

階層表現が可能なインタラクティブなフロアマップ「Interactive Mall Map」

国内でも商業施設の中でも重要な役割を担うフロアマップ。どうわかりやすく直感的に見せるかというのは商業施設においては一つの課題となっていますが、今日紹介するのは、階層表現が可能なインタラクティブなフロアマップ「Interactive Mall Map」です。

InteractiveMallMap_800x600

こちらのフロアマップは各階層ごとに積み重なっているビューから始まり、各階層ごとに詳しく見ていけるようになっています。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:46  |  
Category: javascript , WebDesign   
このエントリーをはてなブックマークに追加
2016年03月13日

divもタブもチェックボックスも回転のエフェクトを与えることができる「TURNBOX.js」

IEのサポートも縮小され、少しづつではありますが、制作の現場もアニメーションやエフェクトに対して積極的になってきました。本日紹介するのはdivもタブもチェックボックスも回転のエフェクトを与えることができる「TURNBOX.js」です。

turnbox1

こちらは様々な要素に対して、回転のエフェクトを与えることが可能となっております。例えばON/OFFのトグルだったり、アップロードだったりダイアログだったり、div自身にも与えることができるため、ページ全体を切り替えるようにした使い方も可能です。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:02  |  
Category: javascript , WebDesign   
このエントリーをはてなブックマークに追加

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

2011年07月18日

グラフィティアートをイメージさせるフォント集「50 Awesome Graffiti Fonts」

街などで見かけることグラフィティアートは、独自のフォントを使ったデザインが特徴です。そんな中今回は、グラフィティアートをイメージさせるフォント集「50 Awesome Graffiti Fonts」を紹介したいと思います。


MY TURTLE font by Billy Argel – FontSpace

シンプルなフォントとは対照的に、使用するだけで個性を演出できるデザインフォントが多数紹介されています。中でも気になったものをピックアップしてみましたので、以下よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 04:36  |  
Category: Design , Font   
2009年11月27日

水しぶきを表現できるブラシ「Water Effects Photoshop Brushes」

photoshopでの表現力の幅を格段に広げることができるブラシ、実際に愛用されている方も多いのではないかと思います。そんな中今回紹介するのは、水しぶきをリアルに表現することができる「Water Effects Photoshop Brushes」です。

water01

水の動きをリアルに表現したブラシがいくつかラインナップされています。自然でクリアなイメージを表現する際に重宝しそうです。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:21  |  
Category: Design , Photoshop   
tag: 
2008年10月28日

JavaScript, Ajax、CSSで実現するツールチップ集「30+ Tooltips Scripts」

カーソルを合わせるとぴょんと飛び出すツールチップ。以前「javascript不要のCSSで制御するツールチップ「Easy CSS Tooltip」」や「半透明・角丸のツールチップを表示するJavaScript 「CoolTips」」といくつかDesigndevelopでも紹介してきましたが、今日紹介するのはそんなツールチップのスクリプトを集めたエントリー「30+ Tooltips Scripts」です。


Tooltip.js

主にJavaScript, Ajax、CSSを使って実現しています。沢山のToolTipsが紹介されていますが、今日はその中から気になったToolTipsが公開されていますので下記に貼り付けておきます。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:49  |  
Category: WebDesign   
2008年03月18日

アクション、シェイプ等、photoshopで使える便利な素材が揃う「ladyoak」

今までphotoshopで使えるブラシや、カスタムシェイプがフリーでダウンロードでいるサイトはDesignDevelopでも多々紹介してきましたが、今回紹介する「Ladyoak」はブラシ、アクション、シェイプ、グラデーションとphotoshopで必要なあらゆる素材を取り扱っているサイトです。

ladyoak01.jpg

ダウンロードするにはユーザー登録が必要ですが、登録さえすればフリーでダウンロードができるようになっています。ライセンスは配布されている物に拠りますが、基本的にフリーとなっています。公開されている物で、いくか気になったものを下記紹介しておきます。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:45  |  
Category: Design , Photoshop   
2009年08月08日

wordpress+jQueryで実現するテクニックチュートリアル30選

世界中で使われているCMSの一つwordpress。高い拡張性もその人気の一つですが、今日紹介するのは同じく世界中で使われているjavascriptライブラリjQueryとwordpressを組み合わせて実現するテクニックのチュートリアルを集めたエントリー「30 Tutorials Combining Both WordPress and jQuery」です。

jquerywordpress1
Including jQuery in WordPress (The Right Way)

jQueryを正しく、テンプレートに読み込ます方法から、Ajaxを使ってランダムに記事をピックアップ表示させる方法などなど様々なjQueryとWordpressを使ったテクニックが紹介されています。今日はその中からいくつか気になったものを紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 06:59  |  
Category: WebDesign , WordPress   
2012年08月22日

定番として活躍する ホームアイコン集「Naldz Graphics 4 25 Beautiful Sets of Home Icon」

webで多様する素材の一つ・家の形をモチーフにしたホームアイコンは、さまざまな場面で重宝する便利なアイテムです。そんな中今回紹介するのは、定番ストックとしてさらに追加しておきたい、ホームアイコン集「Naldz Graphics 4 25 Beautiful Sets of Home Icon」です。


Home Folder icon by ~Nachetegr on deviantART

詳しくは以下

(続きを読む…)

続きを読む
posted 09:41  |  
Category: Design   
2013年04月01日

筆の力強さを表現できるPhotoshopブラシセット「12 Free High Res Dry Brush Stroke Photoshop Brushes」

デザイン制作の際に、筆で描いたようなラインを利用する機会もあると思いますが、ソフトにデフォルトで入っている素材だけでは物足りなさを感じている方も多いのではないでしょうか?そんな中今回紹介するのが、筆の力強さを表現できるPhotoshopブラシセット「12 Free High Res Dry Brush Stroke Photoshop Brushes」です。

太さの違いを利用し動きのある筆を表現した、力加減の異なるブラシが12個もセットになっています。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:29  |  
Category: Design , Photoshop   
2010年02月22日

この春つかえる!?花柄のフリーphotoshopパターン集60「60+ Floral Patterns, Backgrounds」

決まった柄をアートワーク一面に敷き詰めることができるphotoshopパターンファイル。簡単に様々なサイズで展開できるのでとても便利です。今日紹介するのは花柄のパターンをひたすら集めたphotoshopパターン集「60+ Floral Patterns, Backgrounds」を紹介したいと思います。

floral-patterns01

ちょっとレトロな柄から、POPなものまで様々な花柄のパターンが集められています。配布形式はpngとpat (photoshop patterns)形式なので、photoshopを普段使っている方はありがたいですね。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:47  |  
Category: Design , Photoshop   
2018年11月13日

高品質な映像でデザインに可能性を与えるフリービデオ素材サイトまとめ「5 Sources of Free High-Definition Stock Video」

美しく高品質な映像をウェブサイトのヘッダーに使用すれば、新たなデザインの可能性が広がります。そんな中今回は、高品質な映像でデザインに可能性を与えるフリービデオ素材サイトまとめ「5 Sources of Free High-Definition Stock Video」を紹介します。

1111_1
Videvo

フルHDや4Kといった高画質な映像と、目的に合ったファイル形式に対応できるフリー動画サイトがまとめられています。気になったものをいくつかピックアップして紹介します。

詳しくは以下

(続きを読む…)

続きを読む
posted 01:48  |  
Category: Design , WebDesign   
tag: 
2012年02月23日

シンプルで使いやすい ピクトグラムアイコンセット「ENTYPO」

さまざまなデザイン性の高いフォントやアイコンを手軽に手入れることができるようになっていますが、どんなデザインにも使いやすいシンプルな素材は、常にチェックしておきたいもの。そこで今回紹介するのが、シンプルで伝わりやすいピクトブラムアイコンを公開している「ENTYPO」です。

デザインを手がけたのは、デザイナーとして活躍するDaniel Bruce氏。普段のデザイン制作に必要なアイコンが揃った、デザイナーに嬉しいセットとなっています。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:36  |  
Category: Design   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。
VR・ウェアラブル・センシングなど様々な技術が一般化され、手に届く範囲で製品化が進んでいます。VR MEDIAは拡張する現実から未来を探るBLOGです。
Template deisgn by iDEACLOUD inc.
トップに戻る