Web制作の面倒な作業におさらば！便利な最新オンラインツール30個まとめ
この記事では、Webデザインやグラフィック制作がぐっと快適になる、最新便利オンラインツール、無料デザイン素材をまとめています。 これらのツールやサービスを利用すれば、これまで面倒だった作業も手軽に、そして短時間で行うことができ、普段のワークフロー改善にもつながります。用途や目的に応じて、お好みのツールを見つけてみましょう。 Web制作をもっと快適に！便利な最新オンラインツールまとめ CSS 3D Transform Examples 遠近感を利用した、奥行き感のある３DデザインをCSSで表現するサンプル集。コードをそのままコピーできるので、カスタマイズも自由自在。 BGJar ウェブサイトの背景デザインに適した、SVG画像をオンライン上で手軽に作成できる無料ツール。ボタン操作のみでカスタマイズを自由に行うことができ、商用利用にも対応しています。 VvvebJS 人気フレームワークBoots
デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話
こんにちは。TAK(@tak_dcxi)です。 今回記事にするのはタイトル通り「デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周り」についてです。以前ツイートしましたが、特に説明もなかったので自分の備忘録も兼ねて。 Androidに明朝体は無い Apple製品しか利用しないデザイナーの方に話したら非常に驚かれるのですが、Androidにはデフォルトで明朝体は入っていないです。 よく明朝体マシマシのデザインを見かけたりするのですが、デバイスフォントだけではAndroidでそのデザインを実現することは不可能だと思っておいたほうが良いでしょう。 ただ、明朝体のWebフォントを利用すればAndroidでも明朝体は表示できるので、デザイン的に明朝体が必須って場合はWebフォントを利用しない手は無いと思います。 個人的見解ですが、デザイン重視なら明朝体はGoogle FontsでN
NHKクリエイティブ・ライブラリー
【お知らせ】 新しく素材を追加し、およそ7000本の素材をご利用いただけるようになりました。 また、静止画もダウンロードできるようになりました。ビデオ会議ソフトなどにも利用いただけます。
素早く確実にWEBデザインをするための手順
新人から「どうやってデザインをしていいか、わからない」という声をよく聞きます。 私も新人の頃、他にデザイナーがいなかったので、 どのような手順でデザインすればいいか、わかりませんでした。 また、自分のやり方が正しいのか不安でした。 今までの経験から、ある程度、素早くデザインするための、 私なりのコツはつかめましたので書いてみたいと思います。 一つの例として参考になればと思います。 はじめに 今回は、カンプ用のデザイン、グラフィックとしてデザインの手順です。 まず、私が求められているスキルとして ・スピード ・クオリティの安定感 があります。 クライアントの求めるデザイン傾向として ・わかりやすい ・一般受けする があります。 また、私は奇抜なデザインや、先進的なデザインをするタイプではありませんし、アーティスティックなタイプでもありません。 どちらかと言えば、定番のデザインをきっちりしてい
美容整形美容外科の高難度手術/仙台中央クリニック
広告を制限しています 広告はクリニックの認知度を高めると共に、イメージを大幅にアップさせます。しかし広告費の増大は、手術料金の高騰につながります。仙台中央クリニックは、テレビや雑誌での広告は一切行っていません。その為、クリニックの認知度は低く、初めて来院される場合、怪しいクリニックと思い、恐る恐る来院される方もいらっしゃいます。本当は他のクリニックで治療を希望していたものの料金が高く、予算オーバーになり、仕方なく仙台中央クリニックを受診される方もいらっしゃいます。仙台中央クリニックでは、出来るだけ低料金で治療を提供するという方針のもと、イメージアップを捨てて、広告を大幅に制限しています。 友達紹介を中心に集客を行っています 仙台中央クリニックは広告を制限しているため、友達紹介での御来院される割合が多いことが特徴です。多くの方が、当院で美容整形を受けた友人の紹介で御来院されます。仙台中央クリ
Basic Process to Apply CSS to Your Website
2014年8月17日 CSS, Webサイト制作 CSSでレイアウトを組むのは、最初はすごく難しく感じるかもしれません。私も何度も挫折しかけました。。でもよく使うプロパティを理解し、少しずつ組み立てていくと自然と慣れてきますよ！今回はサンプルファイルも用意したので、ダウンロードしてコードをじっくり見てやってください。連載企画「実践で学ぶWebサイト制作ガイド」、CSSでラストスパートです！ ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その7 目標：CSSでレイアウトが組める・基本的な装飾ができる 必要なもの：Windows メモ帳 や、Mac OS Text Editなどの文章エディタツール。もちろんAdobe DreamweaverなどのWeb系オーサリングソフトがあるならそれでOK 対象レベル：CSSの基礎知識がある・基本的なCSSが手打ちで書ける 目次
7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座
HOME>jQuery>7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座 約半年前まで、興味はあれども全くもって触れたことのなかった「jQuery」。それどころか、「Javascript」を「Javasprict」と何度となく書き間違える癖のあった私。 結局、「スク水すいすいスクリプト」と語呂を合わせることによりようやく正しい綴りをマスターしたわけなんですが、仕事で扱うと言うこともあり多少はjQueryの仕組みが分かってきた今日この頃です。 そんなわけで、今回は「jQueryが全く分からない人のため」の超初級者向け入門講座と銘打ちまして、jQueryの基礎の基礎を学ぶための記事を書いてみました。 とは言っても「jQueryとはなんたるか」などといった難しい理論を記すつもりは一切ございません。（っていうかそんな偉そうなこと言える程修めてない
優れたユーザビリティを実現する25の基本概念
LVMH Watch & Jewelry PR&AD Manager/Assistant Manager/Specialist
ランディングページの失敗はどこで発生するのか？ | Lean Startup Japan LLC
サービスのコンセプトが決まったら、すぐにランディングページを作成して、サービスがローンチしたタイミングで通知してくれるサービスが増えてきました。 Ash Mauryaの”Running Lean“でも、リーンスタートアップの実践方法として、ランディングページの早期立ち上げを推奨しています。 私も様々なサイトを訪問して新サービスを日々試しているのですが、このランディングページの作り方には、いつも共通した問題（間違い）があると感じているのです。 それは・・・ サービスのコンセプトや利用手順ばかり紹介されていて、なにを解決してくれるのかさっぱり分からないのです。 もっと簡単に言うと、そのサービスを利用した後に、自分がどのように幸せになるか、まったく想像できないのです。 「新感覚のソーシャルメディア」 とか言われて、そのサービスを使った後の自分の幸せな姿って想像できますか？ 初めてサイトを訪れたユ
HTML5でモダンブラウザのCSS3バグを回避するためのハック方法 | ゆっくりと…
将来、何かの役に立つかもしれないので、メモとしてエントリー。 IEなんかの古いブラウザに対応するための CSS ハック方法は古くから知られていますが、CSS3 への過渡期の現在、（本当は使いたくない）ベンダー・プレフィックスや Modernizr なんかを使って新しいデザインにチャレンジしている人も多いことでしょう。 それでもなお、特定ブラウザの、特定バージョンで思った通りのデザインにならないことがあれば、やはり何かしらのハックに頼らざるを得ない状況は、今も昔も変わらないのかもしれません。 そんな場合のハックを An HTML5 boilerplate addon for CSS browser nitpicks から紹介です。紹介されているテクニックは、従来型の CSS 解釈時バグや CSS 属性のアリ／ナシといった特徴や機能ベースではなく、そのものズバリ、ユーザーエージェントによるブラ
これからWebサイトの制作をしたいけど、何から勉強したらいいの？っていう人のためのガイド
以前から、「Webサイトを制作をしたいけど、何から勉強したらいいの？」という質問をよく頂いていました。私が Web制作を勉強し始めた頃に比べると、最近はたくさん情報がありすぎて何から始めればいいのか迷う人も多いみたい …。なので今回は、Webサイトを作るのに必要な知識を簡単にまとめてみました。 最近本だなを整理していて、もう読まなくなった Web制作系の本を片付けたりしてみました。ずーっと前、Webサイトってどうやって作るんだろうってところから始まって、用語もよく分からないまま色んな本を読んだりした頃を思い出します …。 Webサイトは HTML っていうものでできていて、CSS っていうもので、見た目をデザインしていくのかぁ … っていうことさえ、あの頃の私にとっては新しい発見だったなぁ … なんて思ったりしました。 最近では HTML5 とか CSS3 とか、私が勉強し出した頃に比べる
週末に想像力を掻き立てよう！世界中から集まったタイポグラフィが見られるサイト – MARS DESIGN Co.,LTD.
ECサイトを無料で作るオープンソース5選＋3！ 自社ECサイト制作に必要なパッケージまとめ 38,131 views 良い企画書をマネることから始めよう！大手企業が行うプロモーションの企画書事例まとめ 16,680 views 今更聞けないマーケティングの基礎が勉強できる便利な５サイトまとめ 13,238 views 0.1秒の遅れが、1%の売上に影響する!? ページ表示速度の影響力と改善法まとめ 11,786 views 脱初心者！事業計画書の書き方やテンプレート配布サイト4選 11,335 views 売上アップに必要不可欠！販促企画書のアイデアを貰えるサイト5選 8,663 views あなたのサービスが広まる、エレベーターピッチ！ 7,625 views 困った時に使える14パターンの無料名刺デザインサンプルデータ 7,429 views WordPressの導入からデザイン、プラ
目からビームな画像を生成するWebサービスを作った - すぎゃーんメモ
ももいろクローバーZのニューシングル「Z女戦争」が6月27日に発売されます。 Z女戦争(初回限定盤A)(DVD付) アーティスト: ももいろクローバーZ出版社/メーカー: キングレコード発売日: 2012/06/27メディア: CD購入: 4人 クリック: 433回この商品を含むブログ (57件) を見る で、それに先立って公開された新衣装でのアー写が、何故かメンバーが目からビームを放っているものだった。 ももクロ「いいとも」テレフォンショッキングに再び登場 - 音楽ナタリー これに影響を受けて、周りのももクロクラスタの方々が次々にTwitterの自分のアイコン画像を加工して目からビームを放っているものに変更していたりしたのだけど、それなりに画像を加工するツールやテクニックがないと難しいし、手間もかかる。「もっとカジュアルに目からビームを放ちたい！」という需要もあるのではないかと思い、自動
最低限覚えておきたいWEB配色の基本２大原理と６つの配色パターン
ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. WEBサイトのデザインは、誰もが頭を悩ませる部分だ。 「どういう配色なら良い印象を持ってもらうことができるのか？」「どのレイアウトならコンバージョンが上がるのか？」など、様々なところまで考えを張り巡らさなければいけないからだ。 そこで本日は、The Art of Color Coordination というインフォグラフィックをご紹介する。これを見れば、WEB配色の基本の２大原理と、今すぐに使える６つの配色パターンがすぐに分かる。 そして、初心者でも、統一感のある配色のWEBサイトを作るための大きな助けとなるはずだ。 WEB配色の２大原理と６つの配色パターン画像を拡大して表示する ※追記：インフォグラフィックの最後のクレジットの部分が途切
Basic Logo Design Process
2013年3月25日 Webデザイン 企業のイメージを明確にすることを「ブランディング」と呼びます。企業ロゴはそのブランディングが色濃く反映され、企業のイメージを左右する重要な部分です。今回は「ロゴとはなんぞや？」というところから、私のロゴを実例に、ロゴの制作手順を紹介しようと思います。 ↑私が10年以上利用している会計ソフト！ 先日「ロゴデザインする時の参考に！ロゴデザインギャラリーのオンパレードと注目記事色々！」という記事内で、なるほどな、と頷ける文章に出会いました。 WEBサイトは、エンドユーザーに伝わらないデザインだとわかればリニューアルするけど、ロゴデザインはエンドユーザーに伝わらないからと言って作り変えることは殆ど無い。それはつまり、ロゴはお客様の為に作るんじゃないと、ロゴは自分たちの意思や考えの象徴でもあるからそんなに簡単に変えるわけにはいかない、自分たち（ロゴに込められた物
レスポンシブデザインのテストツールx4 – creamu
Device-Agnostic Approach To Responsive Web Designという記事で、レスポンシブデザインのテストツールが4つ紹介されています。 Responsive Design Testing URLを入れると4つの画面でプレビューできるツール Responsive.is URLを入力すると、デバイスごとのアイコンクリックで表示を切り替えられる Responsinator URLを入力すると、デバイスごとの見え方をざっと見渡すことができるツール BriCSS ブックマークレットとして追加して、ワンクリックでデバイスごとの表示を確認 via. Device-Agnostic Approach To Responsive Web Design
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Icons | Font Awesome
元ゴミ回収ドライバーが作るエロWebサービス
Responsive Web Design JP（日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト）
https://design-spice.com/2012/06/13/responsive-web-design-image/