タグ

Webとdesignに関するlemur314のブックマーク (24)

  • ウェブサービス開発の現場におけるデザイナー不要論と5〜10年後の生存戦略 - 情報建築家 石橋秀仁

    稿では、まず「ウェブサービス開発の現場で、ウェブデザイナーの仕事エンジニアに奪われつつある」という脅威を語る。次に、生存戦略を考えるヒントとして「分かりやすい生存戦略」を2つ提示する。「アートディレクター」と「フルスタックウェブデザイナー」という2つの生存戦略だ。 なお、「仕事を奪われていくプロセス」と「生存戦略を遂行するプロセス」について、5〜10年程度のタイムスパンをイメージしている。 ウェブデザイナーの仕事エンジニアによって奪われつつある ウェブサービス開発の現場では、ウェブデザイナーの仕事エンジニアプログラマーによって少しずつ奪われつつある。とくに小さな組織や新規事業の現場では。 象徴的なのは「Bootstrapがあればデザイナー不要だよね」論。「もはや社員としてデザイナーを雇う必要はなくて、必要な時にランサーズで発注すればいいよね」「スタイルシートいじったり画像パーツ作

    ウェブサービス開発の現場におけるデザイナー不要論と5〜10年後の生存戦略 - 情報建築家 石橋秀仁
    lemur314
    lemur314 2014/08/25
    エンジニアとデザイナーに限った話ではないけれど、枠に捉われすぎて仕事をしようとすると仕事が無くなる。 自分がどんなお客さんのどんな問題を解決するのか?の視点で捉え、必要なスキルは身につけていくこと。
  • CSSでレイアウトするなら絶対覚えておきたい配置のルール:フロートや絶対配置、z-index とかいろいろ

    最近改めて CSS の基、要素の配置、レイアウトについて学習しました。過去に CSS でのレイアウトなどの記事を書いた事があるんですけど、改めて勉強してみたら、いろいろ間違えて解釈していたなー ... っていうか、基が分かってなかったんだなーと反省 ...。今回は CSS の基中の基、視覚整形モデルについてまとめてみました。 Webデザインをする上で、必須とも言えるのが CSS …。このブログ – Webデザインレシピでも、過去に CSS について書いた記事がいくつかあります。最近 … でもないけど、以下のふたつは CSS でのレイアウトについて、いろいろと書いた記事でした。 CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ – 2011年 6月17日 CSS:初心者の頃にハマったスタイルシートのあれこれ … IE7多め -2011年 4月21日 で

  • まるでおとぎ話の世界みたい!かわいくてガーリーな21サイトをご紹介

    こんにちは。可愛いサイト大好き。 可愛い女の子はもっと好きな井畑です。 そんな井畑ですが、 ブックマークしていたお気に入りの可愛いサイトが増えてきたので、 今回ここでご紹介したいと思います。 僕の個人的な趣味が含まれますので、 「こんなのガーリーでもなんでもねーよww」とか、 twitterやはてぶで話題になったもので、既に知ってるものなども多くあるかと思いますが、ご了承くださいませ。 それではどうぞー!! Peter Granfors Peter Granfors まずは海外のサイトをご紹介していきます。 フィンランドのグラフィックデザイナーさんのポートフォリオサイト。 クリーム色のベースにピンク・ブラウン・紫のテクスチャーとイラストが繊細でとても可愛いサイトです。動物のモチーフも印象的で、タイトル部分のフラミンゴは勿論、フッターのお猿さんにも注目です。 me & oli me & ol

    まるでおとぎ話の世界みたい!かわいくてガーリーな21サイトをご紹介
  • 日本のウェブデザインはなぜこんなにも世界と違うのか? - BRIDGE(ブリッジ)テクノロジー&スタートアップ情報

    記事は、ブログ『RANDOMWIRE』の運営者の許可を得て、翻訳しています(元記事)。 静寂が満ちる禅庭園、美しい神社、静穏な寺、洗練された茶道。日の伝統建築、現代建築、書籍、雑誌は世界中のデザイナーの羨望の的だ。 だが、どうしてか、こうした巧みな技術はデジタルプロダクトには生かされていないようだ。特にそれが顕著なのは、ウェブサイトだ。その多くが、1998年のスタイルから変化していないように見える。 例1:楽天市場 有名な日のサイトの多くを見てみると、次のような傾向が見られる。(例えば、 Yahoo Japan、楽天、ニコニコ、JR東日、読売新聞…) 隙間なく敷き詰められている文字 小さく、画質の悪い画像 数えきれないほどのカラム 色同士の調和に欠ける派手な色使い、きらきら光るバナー Flashのような、過剰に使用される時代遅れのテクノロジー 美しい俳句、質素なわび・さびとはかけ離

    日本のウェブデザインはなぜこんなにも世界と違うのか? - BRIDGE(ブリッジ)テクノロジー&スタートアップ情報
  • デザインの基礎力をワンランクアップしたい私(Webデザイナー)の注意書き

    Webデザインは、紙の上のデザインと違うところも多いと思います。でも同じデザインですから、歴史ある DTP デザインから学ぶことはいっぱいあります。デザインの基礎の基礎、レイアウトについて、デザインするときに気をつけたい基礎の部分の注意書きです。 毎日インターネットを見ていると、素敵なデザインの Webサイトに出会います。ときにはひと目惚れしちゃうようなこともあります。そんなデザインにあったとき、どうして素敵なのかなーと考えるのも勉強のうち。そう思って素敵なデザインはストックしておいて、自分なりにそのデザインが素敵な理由を考えてたりします。 デザインの理由 どうしてそういうデザインをしたのか … デザインには理由があります。気まぐれに色を選んだり、要素を配置したりしないからです。なので自分のデザインの理由、どうしてそういう風にしたのかということを、口で説明できないとダメだと言われます。もち

  • WEB色見本 原色大辞典 - HTMLカラーコード

    原色大辞典とは 原色大辞典は1997年にオープンしたネットの色見サイトです。 9種類の色見と色に関する各種サービスから構成されています。 色見コンテンツは ブラウザで定義されているHTMLカラーネーム、 日の伝統色、 世界の伝統色、 Webセーフカラー、 パステルカラー、 ビビッドカラー、 モノトーン、 地下鉄のシンボルカラー、 国鉄制定の塗装色 の9つから構成され、特に日の伝統色は古来伝わる先人の色彩感覚を現代に伝えるものとして多くの方々から支持をいただいています。 文字列と背景色の組み合わせを試せる配色大辞典、 規則性のある組み合わせから色を選べる配色パターン。 色見の他にも、今日のラッキーカラー、 コトバから色を解析して調合する成分解析、 ストライプを生成するストライプメーカー、 グラデーションを生成するグラデーションメーカー、 あなたの好きな色と色を調合する色調合、 サ

    WEB色見本 原色大辞典 - HTMLカラーコード
  • ランディングページ集めました。

    2009年からランディングページを集めているサイトです。購買行動や認知拡大のために作られたランディングページのデザインまとめサイトです。LP制作の参考にどうぞ。

  • 年末年始にWebデザインを学び直すための3つのステップ

    この記事は、以下のような方を対象にしています。 現在Webデザイン仕事にしていて、さらにデザイン力をつけたい方 今はプログラマー、ディレクター、コーダーなどデザイン以外の仕事をしていて、来年はデザインも手がけたい方 ※この記事は、2010年末に公開したものを、文章と参考サイトなどのリンク先を修正し、2019年末に再公開したものです。 私は元々Webデザイナーなのですが、デザイン以外の仕事が連続したときなどデザインスキルの低下が心配になってくるので、年末年始など時間があるときは自己流のWebデザイン勉強法をしています。 もしかしたら他の方にも役立つかなと思い、公開しました。 今回は、主にWebデザインの中でも「レイアウト」について書いています。 まずは「知る」こと 私がWebデザインについて基礎からきっちり勉強したいと思い、Webデザインスクールに見学に行ったり「Webデザイン」と名の付く

    年末年始にWebデザインを学び直すための3つのステップ
  • Webデザイナーな私の勉強方法まとめ – VIVID COLORS + BLOG -福岡から東京に出てきたデザイナーのブログ-

    私の勉強方法まとめてみました。 といっても 「いい情報をとりこんで、実践して、その結果をアウトプット」 をひたすらしているだけなのですが、実際にどのようなサイトやを見てインプットしているか、どんな風に実践して、何をアウトプットしているかなどまとめてみました。 インプット 情報が美しくまとまっているサイトのフィードをチェック 国内外のWeb系の情報を丁寧にまとめてくれているブログがたくさんあります。 そういうブログのフィードをチェックしています。 デザインTipsやトレンド紹介、便利なプラグイン、プログラムなど、毎日どんどん新しい情報が出てきます。 全部読んで理解してその場で実践する、というとは不可能に近いので、へー、こういうことも出来るんだー、とさらっと頭に入れて、特に気になったものだけはてなブックマークなどでタグをつけて保存したりしています。 そうしておくことで、いざ●●しないといけな

    Webデザイナーな私の勉強方法まとめ – VIVID COLORS + BLOG -福岡から東京に出てきたデザイナーのブログ-
  • Blitz - ウェブクリエイタの人も,そうでない人も楽しめるデザインブログ

    手相講座 オンラインが気になるなら、こちらのウェブサイトをよくチェックしたほうがいいです。 そして、あなたがすぐ副業になる 手相オンライン講座を購入しようとしているなら、上のウェブサイトで、すぐ副業になる 手相オンライン講座を手に入れると一体何ができるようになるのかについて、十分に理解した上で購入することをおすすめします。 また、レビューや評価が紹介されているなら、それについてもよくチェックしましょう。 下記のすぐ副業になる 手相オンライン講座についての情報も役に立つかもしれません。 商品名:すぐ副業になる 手相オンライン講座 販売商品紹介:手相をゼロから学んで副業になる!覚えなくても始められる!基となる丘・線の解説に加え、応用力がつく読み方や豊富な実例も紹介。特典動画ではさらに学びを活用し副業にしていくための方法も解説した有料鑑定をやるための情報に特化した手相講座です。 電子書籍価格:

  • いま読むべき、クリエイティブWEBマガジン10選

    カッティングエッジなカルチャーをピックアップする、クリエイティブWEBマガジンをセレクト。 いますぐキャッチアップして、クリエイティブシーンのニューウェイヴをサーフしよう! Public-image.org Public-imageは、ANSWR代表の針谷氏によって創められたWebマガジン。 ひとつひとつの記事に、執筆者名が記載されており、 単なるインフォメーションでなく、ひとつの視点によるエディットされた情報が堪能できる。 その独自視点によるコラムは脳汁モノ。 現在は、オルタナティヴスペース「Public-image3D」など、オンラインメディアを飛び出して、 メディアと現場をクリエイティブスクラッチした実験を日々発信中!だそうです。 2次元メディアにとどまらないその心意気にクラップハンズ。 Public-image3D: http://3d.public-image.org 以下サイト

  • http://e0166nt.com/blog-entry-817.html

    http://e0166nt.com/blog-entry-817.html
  • 購買意欲を刺激する!印象的なHTMLメルマガ10選

    マラソンに夢中! nonakaです。 毎週通販サイトのhtmlメルマガを作っているので、他の通販サイトのメルマガも多数購読してます。 今回は、通販サイトのhtmlメルマガを集めてみました。 通販サイト html形式メルマガまとめ セレクトショップ:BEYES(バイズ) 【メルマガの横幅】600px。 【構成】バイヤーからの一押しアイテム、毎週更新される特集ページバナー、新商品情報、ファッションコラムなど。その他、購入者限定のメルマガも配信してます! 下専門店:Tabio(タビオ) 【メルマガの横幅】713px。 実際のメルマガ用のhtml 【構成】雑誌掲載商品、季節のリコメンド、ランキングなど要素が豊富! 無印良品 【メルマガの横幅】569px。 実際のメルマガ用のhtml 【構成】バナーが縦に並ぶ構成が多い。 facebookやtwitterの案内もさりげなくヘッダーに入っている。 z

  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 名刺にパンフレットにWebサイトまで作れちゃう、Adobeの『Project ROME』がすごい! | ライフハッカー・ジャパン

    『Project ROME』は、Adobe製のオールインワンコンテンツ作成ツールです。これがあれば、CDのジャケットやパンフレット、Webサイトなど、18種類ものコンテンツが作れます。ウェブ版とデスクトップ版の2種類が用意されていて、どちらも無料で使えるので、是非お試し下さい。 以下に使ってみた様子を載せておきます。 まず、Project ROMEにアクセスしましょう。 「CREATE」からテンプレートを選べます。コンテンツはこのようにたくさん作れ、名刺、CDジャケット、アニメーションなども作成可能です。 試しに「CD/DVDジャケット」を作ってみます。 プロジェクトはこんな感じです。いかにも高機能って感じが漂っていますね。最下部には、Flashのようなアニメーションバーがあります。 画像や地図を埋め込んだりと、外部ファイルも取り込めるようになっています。 出力は、画像やPDFなど様々。プ

    名刺にパンフレットにWebサイトまで作れちゃう、Adobeの『Project ROME』がすごい! | ライフハッカー・ジャパン
  • WordPress › Error

    This site has been archived. Please visit the Adobe Blog for the latest Adobe articles.

  • 色覚障がい者に配慮したWebサイトの作り方

    2017年4月11日 Webサイト制作, アクセシビリティ, 色彩 今持ってるプロジェクトの中で、視覚・色覚障がい者にも配慮したWebサイトの制作があります。視覚障がい者向けのサイト制作についてはいくつか記事を発見できたのですが、色覚障がい者に向けたWebサイト制作についてはなかなかヒットしなかったので、断片的に読んだものを記事にまとめました。参考にしてみてください! ↑私が10年以上利用している会計ソフト! 追記: 一部表記の仕方を変更しました。 色覚障がいについて 目の、色を認識する細胞の変異で、色の識別が異なることを「色覚障がい」「色覚異常」と呼びます。色覚障がいといってもいろいろな種類があり、ここでは人口の多い赤系統や緑系統の色の識別が困難な、赤緑色覚異常の場合について書いてみます。 困難な点としては 灰色だと思ったらピンクのシャツだった 焼肉の際、生肉と焼けている肉の区別がつきに

    色覚障がい者に配慮したWebサイトの作り方
  • ウェブプロジェクトに必要なファイル群を一括生成!『Instant CSS Code』 | 100SHIKI

    以前に似たようなツールを紹介したことがあるような気もするがやはり便利なのでご紹介。 Instant CSS Codeを使えば、ウェブプロジェクトに必要なファイルを瞬時に作ってくれる。 使い方は簡単でいくつかのオプションを指定するだけだ。ヘッダーの種類やjQueryなどの有無、文字コード、必要なID要素などを入れていけばいい。 そうすればHTMLCSS、必要なライブラリをまとめてダウンロードすることができる。 自分なりのこうしたファイルを持っている人も多いだろうが、まだの人はこういうツールを積極的に活用したいですな。

    ウェブプロジェクトに必要なファイル群を一括生成!『Instant CSS Code』 | 100SHIKI
  • ビジネス向けからポートフォリオまで今時のウェブデザインのチュートリアル集

    ビジネスサイトをはじめ、女性や子供をターゲットにしたサイト、ポートフォリオやブログの個人サイトなど今時のウェブデザインを踏襲したPhotoshopのチュートリアルを紹介します。

  • //// COLOURlovers :: loving colours since 1981

    Share Your Color Ideas & Inspiration. COLOURlovers is a creative community where people from around the world create and share colors, palettes and patterns, discuss the latest trends and explore colorful articles... All in the spirit of love.