ひとりでWeb制作できた！Webデザインの勉強にもなる独学「スライド」総まとめ作成：2014/02/24 更新：2016/06/30 Webデザイン > デザインの流れや基本的なフローなどを勉強しておくだけでも効率が良くなるし、起業の際にも役に立つと思います。デザイナーさんにもっとデザイン力を上げたいと言われたのもあり、今回は制作フローとデザインやその他の知識を学べるように、出来るだけ制作フローにそって、スライドをまとめました。膨大な量になったので簡潔にしています。全てスライドです。 エンジニア速報は Twitter の@commteで配信しています。
Web制作フローが「完璧」にわかる資料や流れのまとめ | コムテブログ
TL;DR 受注前、制作フロー、安定収益源の保守方法まで「作って終わりにしない」Web 制作の一連の流れを記載しておきます。社内だけじゃなく、これから独立する人、フリーランスの方も必見です。 オリエンテーション／受注前 １．書類テンプレート一式 オリエンテーションにおけるヒアリングでは、後に作成する提案・見積書に必要となる質問を用意しておきます。自社の説明をする時は、せっかちなクライアントさんもいるので、だらだら話さず、ポイントを抑えてわかりやすく説明します。ヒアリングした後は、議事録にメモし社内共有。必要な書類（ヒアリングシート／企画書／提案書／業務委託書／見積書／契約書）など一式まとめてますので、書類系のテンプレートは以下で。 企画・提案・見積・納品・契約などのテンプレ・知識まとめ２３ ２．見積もりの目安と計算方法 例えば項目を作るとき１．項目／２．内容／３．設計(人日)／４．製造(人
効率的に学べた！Webデザインを「職種別」に基礎から勉強出来る総まとめ | コムテブログ
作成：2014/01/6 更新：2014/11/01 Webデザイン > Web制作において、Webデザイナーに関係するものを職種別にまとめました。会社によって分け方は違うと思います。今回は参考サイトとスライドを掲載しています。 エンジニア速報は Twitter の@commteで配信しています。 もくじ アートディレクター １．アクセシビリティ ２．ユーザビリティ ３．UX（ユーザーエクスペリエンス） ４．IA（情報アーキテクチャ） ５．画面設計（ワイヤーフレーム） ６．進行管理 Webデザイナー ７．レイアウト・フォントの知識 ８．配色 ９．Illustratorの使い方 １０．Photoshopの使い方 １１．バナー作成 １２．ボタン作成 フロントエンドエンジニア １３．HTML5 １４．CSS3／Sass １５．javascript １６．jQuery １７．WordPressテー
2013年厳選版！フロントエンドエンジニアがオススメするWEB系の技術書・指南書 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 今まではデザイナーという肩書きだったのですが、最近会社の偉い人たちが 「フロントエンドエンジニアがほしいなあー。（チラッ）」 「そうだねー。ほしいねー。誰かやってくれないかなー（チラッ）」 という会話を僕の聞こえるところでよくするので、空気を読んでジョブ・チェンジした次第であります。 さて、今年も残すところあとわずかということで、今年僕が読んでタメになったWEB系の技術書やら指南書やらをご紹介いたします。WEB系の仕事をされている方、今後する予定のある方はぜひ参考にしてみてください。 もくじ 1.Webサービスのつくり方 ~「新しい」を生み出すための33のエッセイ 2.スマートフォンサイトデザインブック 仕事で絶対に使うプロのテクニック 3.レスポンシブWebデザインテクニックブック プロが教えるマルチ
手遅れになる前に！Webディレクターがプログラミングを学ぶ時に使いたいサイト10選
プログラミングを「本気」で勉強するのに役立つサイト10選とその解説 | 今年はWebディレクターもコードを書こう！ 『Webディレクターは、コードを書く必要はない？？』 もちろん本業のエンジニアと同等のコードを書く必要はありません。しかし、プログラムの全容や工数を把握し機能の優先順位を付けたり、技術面でエンジニアとのコミュニケーションをする上で、プログラミングを覚えることはプラスになります。 さらに、「こんな実装が出来るなんて凄い！」といった実感を伴った一つ一つのコミュニケーションが、エンジニアからの信頼を獲得する助けになるのです。 どうやってプログラミングを覚えるか？ プログラミングは、毎日のちょっとした勉強の積み重ねで学習する事もできます。 今回はスタートアップで働くWebディレクターの方々に向けて、プログラミングを学べるサイトを10連発でまとめました。 このエントリーでは、
これだけは講読したい！デザイナー向け海外ブログ厳選20本+α | 素材系・ノウハウ系 etc.
使える資金が少なく、宣伝広告にリソースを割けないスタートアップ。ユーザを増やし、サービスを使ってもらうための有力な施策の一つは、良いデザインを採用することです。 先日、日本発のOrigamiがスタートアップ界隈で有名になりましたが、優れたデザインが高く評価されたことは記憶に新しいでしょう（記事：出資元のKDDIがデザインセンスを高く評価、5億円を出資）。スタートアップといえども、デザインを軽視することはできないのです。 Webデザインだけでなく、最近ではアプリのUIなど、デザイナーの仕事は広がっていくばかり。忙しさを理由に、日々の情報収集を日本語のブログだけで済ませていませんか？ 良いデザインを誰よりもいち早くキャッチアップしサービスに活かすため、海外ブログの購読はもはや常識と言っても過言ではありません。 このエントリーで取り上げるブログのカテゴリは以下の通りです。 ● デザイン方法論系
ogino.ficc.jp: これからWeb制作に関わる人に読んで欲しい本・ブログ記事
これからWeb制作に関わる人に読んで欲しい本・ブログ記事 私たちWeb製作者の仕事は単にWebサイトを作ることではありません。Webサイトのマーケティング活用を通じてクライアントのビジネスに貢献することです。クライアントのビジネス成長なしに、私たちのビジネスは存在することはできません。単に「ものを作る」ということだけでは十分な存在意義にはならず、彼らのビジネスを理解し、成長に貢献することができなければ価値を生み出すことはできないのです。 残念ながら日本ではWebサイトのマーケティング活用について（又はより広く、デジタルマーケティングについて）学ぶ方法が少ないのが実状です。プロフェッショナルを創出する教育機関は無く、新社会人と現場の間には求められるスキルレベルの大きなギャップが存在します。このギャップは実務的なスキルの不足だけが原因ではないため、案件を通じたコーチングだけで埋めることもできま
これなら分かる！WEB制作を無料で「学べる」サイトまとめ
作成：2013/02/4 更新：2014/11/01 Web制作 > 基本的なところを簡単に、楽しく覚えたい 自分でサービス作ったり、会社や違う職種でも 色々と「基本」はおさえておきたい 今回はサイト制作に必要な「基本的な知識・情報」を、分かりやすいサイトを中心にまとめました。必ずおさえておきたいスキル・知識です。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．HTML5 ２．CSS ３．レスポンシブ ４．配色 ５．視線誘導 / 心理学 ６．インターフェース / ユーザビリティ ７．SEO ８．ディレクション ９．アクセス解析 １０．WEBマーケティング １１．コピーライティング １２．ソーシャル １．HTML5 HTML5って何？ HTML5とは何かを簡単にまとめてみた - Yahoo! JAPAN Tech Blog Canvasについて知っておく
簡単で便利すぎ！WEB制作を「楽」にする無料ツールまとめ
作成：2013/01/28 更新：2014/11/01 Tool > Webサービス フリーソフト、無料ツールなのにここまで使える 前回、無料素材をご紹介しました。 今回は無料で使える「ツール」をまとめます。フォント、画像、配色、htmlからエディター・アフィリエイトリンク作成補助まで。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．フォント ２．画像編集 ３．ロゴ作成 / ネタ ４．配色 ５．HTML5 ６．CSS ７．ブラウザチェック ８．エディター ９．アフィリエイトリンク作成 １０．フォーム作成 １．フォント PCにインストールされているフォント一覧をプレビュー Font picker イラスト等に使われているフォントを調べる WhatTheFont Windows上のテキストをくっきり、見やすく表示。 gdipp - ｋ本的に無料ソフト・フリー
2012年北米でWEB制作者として生きてきた僕にとって絶対に無くては成らなかった英語圏サイト全部！ | バンクーバーのうぇぶ屋
This is my roundup post of online information sources, such as technical blogs and trend websites, that helped me a lot as a web designer through out this year. Massive thanks to those pages, and you all! さて、僕の年末感謝祭（？）もいよいよ大詰めです！前回は2012年を振り返って 僕にとって無くては成らないアプリやWEBサービスの数々を大感謝の思いでご紹介させて頂きました。 今回は2012年の僕にとって知識や情報の宝庫となってくれたサイトの数々を今回は英語圏に絞って超感謝の意を込めて全部一気にご紹介させて頂ければと思います！ この一年、僕の Facebookや Twitterで何度も何度
WEB屋にとって便利なジェネレーター色々！最近のオススメも、昔から使ってきた物もまとめてご紹介！ | バンクーバーのうぇぶ屋
WEB屋を名乗って仕事をする以上、作業効率を考える事は必要最低限の努力だと言うお話は何度かこのブログでもさせて頂いてきました。 まぁしかし、ぶっちゃけ何が自分にとって作業効率に繋がるかはやってみないと分からないですよね。作業時間の見直しをするだけで効率化に繋がるかもしれないですし、ツールをもっと使いこなすことだったりするでしょうし、コミュニケーションを円滑にすることで作業効率につなげたりと、何が一番効率化に直結するかは人それぞれだと思います。 ただ、何度かこのサイトでもWEBサイトを作る上で便利そうなジェネレーターの存在を共有させて頂いてきましたが、こういうツールは知ってるのと知らないのとでやはり大きな差が出てくることはやっぱり多いと思います。特に最近はWEBに強いクライアントの存在も目立ってきて、自分だけじゃなく、お客さんにとっても、もしかしたらプラスになるジェネレーターの類も多いんじゃ
美しい…。フォトグラファーのポートフォリオサイト20選！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、ゴウです。 私、写真撮影なんぞが趣味なのですが、その道のプロ、フォトグラファーさんのサイトってカッコイイのが多いんですよね。写真素材が素晴らしいからっていうのもありますが、見せ方なんかも工夫されていて、独特の世界観に引きこまれてしまいます。 という訳で、今回はフォトグラファーのポートフォリオサイトをまとめてみました。 Eric Ryan Anderson https://www.ericryananderson.com/ Fashion Photographer Milan Paolo Boccardi – Fotografo Milano https://www.fashionphotographer.it/ Future home of something quite cool https://www.kiranowal.com/ Clayton Bozard Photog
Webユーザビリティを改善するための5つのポイントと方法
先日の記事[競合サイト調査・分析に必要なチェック項目と役立つツール達！]でユーザビリティの調査・分析方法を軽く紹介しましたが、今回はWebユーザビリティを改善するための5つのポイントと方法を紹介したいと思います。 まずユーザビリティとは何なのかについて軽く触れておきます。先日の記事でも紹介しましたが、それは【使い勝手】のことです。WEBユーザビリティの改善とはすなわち、WEBサイトの使い勝手を良くするということになります。ではその使い勝手とは何なのか。それは単純に【使いやすさの程度をあらわした言葉】のことです。使い勝手が良いということは、使った人から見てその【何か】は使いやすかったということになります。そして今回のこの記事は【どうしたらユーザーに使いやすいと感じてもらえるのか】について紹介しています。 この【WEBユーザビリティを改善するための5つのポイントと方法】は下記の項目で紹介するヤ
良い企画書をマネることから始めよう！大手企業が行うプロモーションの企画書事例まとめ | SUN MEDIA｜販促のまとめ
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,664 views あなたのサービスが広まる、エレベーターピッチ！ 7,625 views 困った時に使える14パターンの無料名刺デザインサンプルデータ 7,429 views WordPressの導入からデザイン、プラ
ディレクターが指摘すべきデザインの注意ポイント10個
ずいぶん久しぶりの投稿になってしまいました。申し訳ない。 今回はタイトルの通り、ワイヤー上がった！デザイン依頼した！で上がってきたデザイン案（もしくはモックアップ）を見て、その段階でディレクターが何を「確認」すればいいのか？という内容についてです。 もちろん経験を積む。もしくは自分自身でデザイナーも経験するなどの機会に恵まれれば大丈夫なんですが、僕みたいに「いきなりWebディレクターという肩書きを与えられてしまった人」は、デザインの何を確認すれば良いのか分からなくなってしまうケースも多いんじゃないかな？と思って書いてみました。 実際にはマークアップ後まで影響してくるので、もっともっと項目は伸びると思うのですが、ひとまず僕が注意して見ているポイントを10個ピックしています。 色数を使いすぎていないか あれもこれも！と欲張りすぎて、結局なにが「一番強調したいのか」が分からなくなってしまっている
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
レスポンシブWebデザインで作られた10の美しすぎるサイト ｜SEO Japan by アイオイクスSEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
PCにモバイル、スマートフォンにタブレット、そして今後はデジタルTVまでユーザーがデジタルコンテンツに多種多様なデバイスでアクセスし、消費する時代が本格化している最中。デバイス毎にウェブサイトをデザインしていてはキリがないとばかりに、最近注目されているのが「レスポンシブWebデザイン」という画面サイズやOSにデザインを柔軟に対応して表示させる手法。今回は、そんなレスポンシブWebデザインを実践しているサイトからThe Next Webが厳選した10の素敵なサイトを紹介します。 — SEO Japan 最近、皆が異なる方法でコンテンツを消費している。私の母はネットブックを持っているし、友人は27インチのiMacを持っていて、ガールフレンドと私はスマートフォンを持ち、彼女の母はiPadを持っている。 あなたのコンテンツはこれまでになく多くのデバイスとブラウザで閲覧されており、デザイナーはそのこ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
日本語Webフォントを使った一味違うWebサイトまとめ
Web業界にいるなら誰でもRSS登録しているだろうサイトまとめ16個 - W3Q