デザイナーからデザインの基礎や原則を学べるエントリーまとめ（webデザイナ向け）
webデザインの入門書を買おうか迷っている方。 もしもそんな方がいたら、ネット上にはここを押さえておこうよと、webデザイナーが直接良質な記事を仕上げてくれていますのでそちらを是非一度参考にしてみて欲しいなと思いまとめて見ました。 また、その記事で、もっともぐっときた台詞もチョイスすてみました。 どんな想いで記事を書かれているかというのも大事かなと。 こちらもあわせてどうぞ。 Web制作をこれから始める人の為のスキル・HTML・CSS・ブラウザ・写真素材入手の基礎情報 とりあえず時間のない人はこの3つだけでも食べて デザインを勉強したことがない人でもデザインできるようになるかもしれない4つの基本原則 最初、デザイナーは型破りであるというイメージを抱く人も多いのですが、実際の現場では、様々な原則の上にあるルールにのっとり、そのルールを崩す「理由」があります。 例えばそれがセンスと呼ばれること
有料でもおかしくないようなクオリティの高いWordPressテーマを無料で配布しているサイトいろいろ - かちびと.net
ご質問頂いたので記事にします。クオリティ の高いWordPressのテーマで無料のものは 無いか、または無料で手に入る方法は無い か、とのことでしたのでなかなかクオリティの 高いテーマを無料で配布してくれているサイト をいくつかご紹介します。 というわけで無料で手に入る、有料ライクなWordPressテーマを配布しているサイトのまとめ。ハイクオリティかどうかは個人差があるかなとは思います。 デザインはもちろん、テーマの機能をどういったコードで実装しているか、というのも参考になりますので開発目的に見ておいても損は無いかなと。 dessign swiss-missやonextrapixelでも評価されたデザイナー、クリエイター向けのテーマ。ホワイトベース中心です。有料版もありますが、無料版も見劣りしません。 example dessign Templatic TemplaticはCMSやポート
未経験からWebデザイナー、Webクリエイターを目指す人のためのWordPressとTwitterをつかった就転職活動のすすめ - DESIGNMAP
仕事を続けながら勉強、制作をしよう 未経験からWebデザイナーになる場合も作品が求められる。未経験だからこそ、しっかりしたクオリティの作品を用意したい。そういう作品をつくるために、勉強をすることになる。 Webデザイナーになる準備期間は個人差や目指すスキルにもよる。Illustrator、Photoshop、HTML、CSS、JavaScript（jQueryも含む）、WordPressでサイトが作れるくらいのスキルを目指すとすると、目安で１年くらいはかかるだろう。もちろん、スキルや期間はあくまで目安である。習得には個人差があり、あくまで自分のペースを守ることが大事である。 具体的な勉強や行動のステップは「まったくのゼロから、独学でWebデザイナーになる方法」を、デザイン自体の勉強は「まったくのゼロから、デザインを独学する方法」を参考にしてほしい。 準備期間は１年くらいの長期戦になる（後述
WEBのデザイナーさんが持っておくと便利そうなPSD素材色々:phpspot開発日誌
100 Free PSD Files Every Web Designer Should Have - icanbeCreative WEBのデザイナーさんが持っておくと便利そうなPSD素材色々 WEBのレイアウトやパーツに関するPSDファイルが多数紹介されていて、素材として使えそうです。 PSDならレイヤー分けができていたりするものも多いので再利用性が高くて使い勝手がよいですね 関連エントリ かなりクールなPhotoshop用フリーUIキット-PSDファイル50個 クールなUIパーツを収録したUI作成用PSDキット「Transparent Glass UI」 色々使えそうなフリーのPSD素材ファイル３０
センスではなく具体的に解説する「同人誌やイラストの美しいデザイン100」
同人誌において一番の勝負所とも言うべき「表紙」デザインに非常に役立つさまざまなテクニックを「センス」という言葉で都合良くごまかしたりせず、「なぜそのようなレイアウトを選ぶのか？」「どのような効果が期待できるのか？」「どういうときに使えるのか？」「実際に行う上で気をつけるべきポイントは何か？」というような点がちゃんと書いてあるため、表紙のアイデアデザイン見本帳としても非常に有用なのがこのマール社から出版された「同人誌やイラストの美しいデザイン100 レイアウトの基本から配色、文字組みまで」です。 マール社から献本してもらい、届いた実物がコレ この表紙部分を担当した方のブログによると、「今回執筆させていただいた『同人誌やイラストの美しいデザイン100』は、拙著同人作品『同人誌やイラストを美しく魅せるデザイン100の方法 増補改訂版』の書籍化、という立ち位置にはなっていますが、内容はほぼ全て別物
ウェブサイト作成に役立つ35のwebサービス｜Webpark
ウェブサイトを作成する際に個人的に使っているWebサービスを紹介します。幅広く35個紹介しますので、新しい発見があれば幸いです。 フォント関係 wordmark.it パソコンに入っているフォントを一覧で見ることができます。フォントサイズも調整できます。 日本語フォント252種類を表示確認できます！フォントを探すならfonthack.jp。 日本語フォントの表示が確認できます。現在252種類あります。 PXtoEM.com: PX to EM conversion made simple. ベースのサイズ（px）を決めると、em, pt, %の値が表示されます。 カラー関連 ウェブ配色ツール Ver2.0 配色ツールは色々ありますが、日本語ですし、あまり考えなくても感覚的に使えるので楽しいです。 Color Scheme Designer 3 カラーパレットジェネレーターです。海外サイトで
「Photoshop」で人物を上手にマスクするテクニックとは | クリエイティブ | マイコミジャーナル
アドビ システムズは都内にてクリエイター向けのセミナー「デジタルフォト&デザインセミナー2011～トップクリエイターのテクニックとアイデア～」を開催した。セミナーでは、「HP WorkstationとAdobe CS5.5による写真と動画の最先端レタッチテクニック」が行われた。 セミナーでは、「Photoshop」のパペットワープを使ったレタッチテクニック、「Illustrator」の「エンベローブ」を活用した画像処理テクニックに続いて、「Photoshop」で人物をマスクするテクニックが、フォートンのプロデューサー 兼子研人氏とレタッチャー toppy氏によって紹介された。 Photoshopで人物をマスクするテクニック この画像の子供のマスクを作成する まず始めに、画像の子供の部分を範囲選択し、「選択範囲→境界線を調整」を選ぶ。次に「エッジの検出(スマート半径)」を使い子供の輪郭に沿っ
ファンタジーRPGのアイテムっぽくて手書きのアイコンセット「Legendora Icon Set」
CCライセンスで提供されており、個人利用ならフリーのアイコンセットがこの「Legendora Icon Set」です。ゴミ箱がクリスタルで表現されていたり、ファンタジーRPGでよく出てくるようないかにもそれっぽいアイテムの数々がくっついてフォルダアイコンが揃っていたり、Firefoxのアイコンがあったり、見た目のかわいさと実用性とを兼ね備えた使いやすくバランスの取れたアイコンセットとなっています。 ダウンロードとその他の同じような雰囲気のアイコンいろいろは以下から。 Legendora Icon Set by *Raindropmemory on deviantART http://raindropmemory.deviantart.com/art/Legendora-Icon-Set-118999011 作者はRaindropmemoryさんで、以下がアイコンセットの中身を紹介した画像で
40 Seriously Funny Print Ads
Print adverts need to get a message across with a single image and without the recourse of interactivity that we find today on the Internet. As interactive media expands, attention spans are getting shorter and shorter every day. For any company trying to get their product or service out in print format, the task is ever more challenging and difficult. Humorous ads remain one of the few effective
Inkscape - Wikipedia
Inkscapeでの編集例 Inkscape（インクスケープ）はオープンソースで開発されているベクター画像編集ソフトウェア（ドローソフト）。 概要[編集] InkscapeはXML、SVG、CSS などの標準に完全に準拠したグラフィックツールとなることを目標としている。クロスプラットフォームなソフトウェアであり、Linux、Unix系オペレーティングシステム (OS)、macOS、Windows などで動作する。開発の主体はLinuxで行われている。Inkscape は現状でも幅広く利用されているが、今後さらに SVG、CSSの標準への準拠を完全にしていくことが可能で、それにはSVGアニメーションの対応も含まれる。現在も活発に開発中であり、新しい機能が定期的に加えられている。 Adobe Illustratorの代替ソフトとして紹介されることも多い。しかし印刷物の作成を目的として作られたソ
最小限のテーマの作り方（2カラム編）-1
テーマHacks » 最小限のテーマの作り方（2カラム編）-1 「最小限のテーマの作り方（2カラム編）」では5回に渡ってWordPressの2カラムのテーマの作り方について話します。 今回使用するファイルは % ls index.php header.php footer.php sidebar.php style.css の5つになります。 まず、index.phpから。下にindex.phpのソースコードを示します。 <?php get_header(); get_sidebar(); ?> <div id="content"> <?php while (have_posts()){ the_post(); ?> <h2><?php the_title(); ?></h2> <?php the_content(); ?> <?php } ?> </div><!-- id="conte
WordPress テーマの作り方（１）
今回の「おでげーと」リニューアルにあたってSandbox をベースにデザインをしてみました。 配布されているテーマファイルをthemes フォルダに入れるだけで様々なデザインを楽しめるのがWordPress の醍醐味ではあるのですが、できることなら世界に一つしかない自分のサイトなのだから、自らデザインしてもっとWordPress を楽しんで欲しいと思います。 その一助になることを願って、今回のリニューアルにあたって僕が行ったテーマ作成の流れをまとめてみました。 （WordPress と銘打ってはいますが、通常のサイトデザイン/作成の流れとしてみてもらってもいいかもしれません。） 1.テーマのイメージスケッチを書く サイトでもっとも訴えたいのは何か、どういうサイトにしたいのか、（クライアントから依頼されたサイトであれば）クライアントのイメージはどのようか、というようなことを考えながらイメージ
株式会社 アイドマ
DXの加速など、コミュニケーションがますます複雑になってきている今、 お客様が持つ想いを共有し、その想いを形にするため、 アイドマは、デジタルとアナログの領域を自由に行き来し、 表現を用いて、目的地に適したルートをご案内いたします。 こんな時代だからこそ、ターゲットに届くコミュニケーションデザインを大切にしています。 WORKS
マイデザイン － あなたのアイデアを商品化。気軽にデザイン発注「ファーストデザイン」
あったらいいなを投稿してください。人気投票ランキングにより商品化のチャンス。あなたのアイデアが商品化されれば、販売額に応じた賞金もゲット！
ハイクオリティサイトのワイヤーフレーム分析 (1) 他サイトのワイヤーフレームから学べること
ワイヤーフレームとは「ページの大まかな見取り図」のことであり、この部分にはこのコンテンツ、というページ構成を示したものである。Web制作の案件では、比較的上流の工程でワイヤーフレームづくりを行い、その後にビジュアルデザインやインタフェース制作、(X)HTML+CSSページへの落とし込みの作業に入る。 コンテンツそれぞれをどこに配置するかという判断、いわゆる「情報アーキテクチャ」は、限られたスペースを有効活用するのに重要なだけでなく、ユーザービリティ(使いやすさ)やファインダビリティ(発見しやすさ)にも大きく関わってくる。ユーザー中心デザイン(User-Centered Design: UCD)という言葉を借りなくとも、Webサイトはユーザーに使ってもらってはじめて意味があるのであって、運営者とユーザー双方の満足が、車の両輪のようにサイトを動かし、発展させるのである。 特にトップページのワイ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
スタイルシート［CSS］/CSSの基本/ID名とクラス名 - TAG index
so-network.biz
splash
David Mascha
CSS Spriteを活用しよう - DesignWalker
