Webサイト制作の要件定義書の確認項目｜重松佑 / Shhh inc.

2023/07/13 394 users 要件 重松佑 最小限 メモ プロジェクト進行

プロジェクトのキックオフ前後に作成する要件定義書。確認の抜け漏れを最小限に抑えるには、どのようなことを記載しておくべきか。そして、メンバーへのスムーズな共有と、その後の円滑なプロジェクト進行のための、良い要件定義書とはどのようなものだろう。自分たち用のメモも兼ねて「Webサイト制作プロジェクトの要件... 続きを読む

jQuery使いのエンジニアがReactとNext.jsでWebサイト制作するために最低限押さえておきたいコード（基礎編）

2023/01/23 357 users jQuery React Svelte Vue 構文

なぜ書いたか 筆者もWebサイト制作をそこそこ長くやってきておりいまは業務でVueを書いたりちょっとReactを書いたりSvelteを書いたりしていますが、2年前くらいまではReactやES6の構文すら書いたことがありませんでした。 WordPressでのサイト制作が多く、機能が少ないサイト制作会社ではjQueryで充分なことも多く、恥ず... 続きを読む

Webサイト制作をどれくらいの粒度で分解してタスク化するか｜重松佑 / Shhh inc.｜note

2021/07/06 598 users 重松佑 タスク化 粒度

プロジェクトが始まるときにかなり初期の段階でWBSを作ることは多いとおもいます。そのWBSの作成、プロマネやディレクターに任せっぱなしになっていないでしょうか。WBSはスケジュールをガントチャートで表したものを指していると思われがちですが、実はスケジュールだけでなく見積もりやアサインを精度高く行うためにも... 続きを読む

Web制作が捗るChrome拡張機能12選 – おすすめの拡張機能を集めてみた | Pulp Note - WebデザインやWebサイト制作の現場で使えるTipsやアイデアを紹介

2021/06/17 228 users 依存性 初見 Pulp Note Tips 12個

Chrome拡張機能にはWeb制作に便利なものが多く、私もよく利用しています。特に1〜2クリックでさっとチェックできるものは頻繁に使い制作の中で馴染んだものであるため、これらがないと手間どってしまうくらい依存性の高いものばかり。今回は私がよく利用しているChrome拡張機能を12個紹介します。初見のものがありました... 続きを読む

あなたのWeb制作をサポートしてくれるオンラインツール10選 | Pulp Note - WebデザインやWebサイト制作の現場で使えるTipsやアイデアを紹介

2021/06/01 309 users Pulp Note Tips transform 現場 あなた

Web制作をサポートしてくれるツールを10個紹介します。mix-blend-modeやgridレイアウト、transformなどのコードの他にもフォントチェックや背景画像を作成できるツール、VSCodeのテーマ作成ツールもあります。あなたのWeb制作を快適に進めるためにチェックしてみてください。 CSS 3D Transform Examples CSS 3D Transfor... 続きを読む

Adobe製品を使わない"デザイナー"？「ビジュアルコーダー」が考える、自己満足で終わらないWebデザインとは | アンドエンジニア

2020/06/16 515 users インタラクション アンドエンジニア デザイナー えん 分業体制

Webサイト制作では通常、「デザイナーの作ったデザインをエンジニアが実装する」という分業体制が一般的。 しかし、今回なめサンは、サイトの見た目・動きのデザインから開発まで、すべてひとりで行っている。 優れたアニメーションやインタラクション（ユーザー操作へのフィードバック）をデザインし、自ら実装するエン... 続きを読む

SVG形式のファビコンを設置しよう | Webクリエイターボックス

2020/02/12 137 users ファビコン SVG PNG SVG形式 画質

2020年2月13日 SVG, Webサイト制作 つ・い・に！ファビコンもSVG形式が対応されるようになりました！SVGを使えばこれまで使われてきたPNGなどのビットマップ形式とは違い、拡大縮小しても画質が劣化しません。つまり、過去記事「クリエイティブなファビコンを設置しよう」で紹介したように多くのサイズを用意する必要は... 続きを読む

CSSで見出し固定＋レスポンシブ対応の表を作成 | Webクリエイターボックス

2019/10/16 345 users CSS Webクリエイターボックス 作成 レスポンシブ対応

2019年10月17日 CSS, HTML5, Webサイト制作 料金表やサービスプランの比較、タイムテーブルなどなど、使う場面が多い割には制限も多く、初心者には少しとっつきにくいと思われがちな表。今回はあると便利な表の見出し固定やレスポンシブ対応の方法を紹介します。 見出しの行を固定する 表の中の行が増えてくると、スクロ... 続きを読む

Webアイコンフォントの【Font Awesome】がアカウント登録必須になったので、使い方をおさらいしました | Webクリエイターボックス

2019/09/04 64 users Font Awesome アイコン 汎用性 多数 画像

Webアイコンフォントの【Font Awesome】がアカウント登録必須になったので、使い方をおさらいしました 2019年9月5日 Webサイト制作, 便利ツール Font AwesomeはWebページ上にアイコンを表示させるためのサービス。汎用性の高いシンプルなアイコンが多数用意されています。アイコンの画像をご自身で用意しても構いません... 続きを読む

拝啓、お客様。Webサイト制作のコストはここにかかります。 | 東京上野のWeb制作会社LIG

2019/05/09 1646 users 拝啓 Web制作会社LIG コスト 東京上野 お客様

令和ですね。こんにちは。バックエンドエンジニアのまさくにです。ゴールデンウィークで休んでいたら、シュワシュワと筋組織が融解し、「自然に帰ろう……自然に帰ろう……」と遺伝子に刻み込まれた内なる声が僕を光射す方へ誘いました。もはや社会復帰は難しいかもしれない。 さて。さてさて。 皆さま、いかがお過ごしです... 続きを読む

【デザイナーに朗報】コーディングなしでWebサイト制作が完結する最強ツール発見。 | 東京上野のWeb制作会社LIG

2019/01/29 55 users コーディング MTG Web制作会社LIG デザイナー 朗報

こんにちは、デザイナーのゆうこです。突然ですが、Webデザイナーの皆さん！ ちゃんとデザインする時間、取れていますか？ というのも、私たちデザイナーの業務は、デザイン以外にもコーディングや要件定義、MTGなど多岐にわたります。Webデザイナーにとって、それらの業務もこなしながらコーディングも行うことはなかな... 続きを読む

Adobe XDでシンプルなワイヤーフレームを作ろう！便利なUIキットいろいろ | Webクリエイターボックス

2018/07/02 124 users ワイヤーフレーム デザインテンプレート UIキット 前段階

2018年7月2日 Webサイト制作, XD 新たなデザインツールとして浸透してきているAdobe XD。Webクリエイターボックスでも何度か紹介してきました。Adobe XDはデザインを作り込むだけではなく、その前段階であるワイヤーフレーム制作にもおすすめです。様々なUIキットと呼ばれるデザインテンプレートが配布されていますが、... 続きを読む

久々にWEB制作依頼が来たのでやるべき初歩的なことを纏めた - PCゲームが唯一の趣味

2018/03/21 67 users 唯一 趣味 PCゲーム ko-ch 先方

2018 - 03 - 21 久々にWEB制作依頼が来たのでやるべき初歩的なことを纏めた 雑記 どうもko-chですo(･ω･｡) WEBサイト制作の依頼が来たので メモ的な意味も兼ねて、記事を書いていきたいと思います。 まじめな話ですね。 なぜ依頼が僕にきたのか 友達のオープンするお店について そもそも僕にできること そもそも僕の経歴 技術 実績 先方に確認しなければいけないこと 全体の流れをお... 続きを読む

Webサイト制作に入る前の打ち合わせで考えることとお客様と話し合うこと – YATのBLOG

2018/03/08 50 users リニューアル 記述 フリーランス 受託 最初

WEBデザインをする上で必要な知識・情報・技術等の記述や、参考になるサイトの紹介等を掲載しています。フリーランスになってお仕事を頂くお客様と直接話す機会が増えてきました。 会社員の頃は受託の仕事ではなかったので、こういった経験がないまま独立したため、最初に聞いておくべきことや確認する事が非常に多く、結構時間がかかります。 僕の場合、Webサイトを作って欲しい、リニューアルをして欲しいという要望から... 続きを読む

初心者向け！HTML/CSSのコーディング手順をイチからしっかりと。 | Webクリエイターボックス

2018/03/02 90 users CSS コーディング コーディング手順 イチ HTML

2018年3月2日 CSS , HTML5 , Webサイト制作 HTMLやCSSの書き方を勉強してみたという初心者さんから、いざ自分でWebページを作っていくとなると、何から始めればいいのやら…？という声をよく耳にします。きちんと構成を考えてコーディングを始めないとレイアウト崩壊の危機…！今回は完成したデザインをHTML/CSSでコーディングしていく第一歩目の手順を紹介します。 今回作るWebサ... 続きを読む

クリエイティブなファビコンを設置しよう | Webクリエイターボックス

2017/09/22 431 users ファビコン favicon Favourite ICON タブ

2015年4月23日 Webサイト制作 , 便利ツール Webサイトの制作時に、特に初心者さんが設置を忘れがちなファビコン。Webサイトをブックマークした際や、タブ表示した際にサイト名の横にちょこんと表示されている小さなアイコンのことです（Favourite + Icon = Favicon）。デバイスが増え、これまでとは設置方法が少し変わってきているのと、機能のついたファビコンも増えてきているの... 続きを読む

日本らしさを表現！CSSで文字の縦書きに挑戦！ | Webクリエイターボックス

2017/08/24 94 users 縦書き 横書き CSS Webクリエイターボックス 挑戦

2017年8月24日 CSS 日本の書籍は元々上から下、右から左という縦書きで書かれてきました。しかしWebサイトでは横書きが基本なので、縦書きを取り入れることで日本らしさやWebサイトの個性を引き立てられます。かつてのWebサイト制作では縦書きが難しく、多くの場合画像を使って表示されてきましたが、CSSでも縦書きが実装できるようになりました！今回はそんな縦書き表現に注目したいと思います！ 縦書き... 続きを読む

Webサイト制作におけるフロントエンドの必須スキル＆開発環境はこれで決まり！ - North-Geek

2016/04/22 428 users North-Geek Git Sass Gulp Emmet

最近フロントエンドの流行がどうのこうのという記事をよく目にしますが、実際に現場で 必要となるスキルと開発環境 を紹介していきます。これくらい知っていると全く問題ない。といったことですね。 主にWebサイトを制作のスキルは、 HTML・CSS、CSS3、Sass、SublimeText、Emmet、gulp、Git についてのスキルがあれば開発がしやすく流行の開発環境ではないかと思います。 さて、そ... 続きを読む

Web制作のクオリティを飛躍的に高めるJavaScriptライブラリ10選を一挙公開！ - paiza開発日誌

2016/02/09 834 users 0310lan paiza開発日誌 クオリティ まさとらん

2016 - 02 - 09 Web制作のクオリティを飛躍的に高めるJavaScriptライブラリ10選を一挙公開！ 開発ネタ Webサービス紹介 Webデザイン どうも、まさとらん（ @0310lan ）です。 みなさんは、「 JavaScript ライブラリ 」を活用しているでしょうか？ Webサイト制作 はもちろんのこと、さまざまな Webアプリやサービスなどを開発 する時に、 大幅な時間短... 続きを読む

Node.jsでフォルダ内の全HTMLをキャプチャし画像化 - Qiita

2016/02/04 76 users Qiita YouTube Git Markdown コード

記事「 Markdownから効率的なWebサイト制作を〜CreateJS入門サイト制作時に採用したGitを中心にした原稿執筆方法〜 | ClockMaker Blog 」でさらっと紹介したフォルダ内の全HTMLをキャプチャし画像化する方法。 CreateJS入門サイト - 自動生成ツールの紹介ビデオ - YouTube コードはリポジトリ「 ics-creative/tutorial-create... 続きを読む

Webサイト制作や勉強をする際に役立つ便利なツール・サイトまとめ 100 | NxWorld

2015/12/14 134 users NxWorld 勉強

画像の軽量化やコード圧縮といったツールをはじめ、各種リファレンスサイト、利用している人が多いエディタやデザインツールのショートカット一覧など、Web制作時に便利だと思うツール・サイト・チートシートを自分のブックマークがかなり乱雑化してきたのでその整理も兼ねて一気にまとめてみました。もちろん他にもこういった便利なものは沢山ありますし、自分も普段からここで紹介しているもの全てを利用しているというわけで... 続きを読む

無料なのに高品質！Webサイト制作が捗る無料WordPressテーマ24個まとめ - PhotoshopVIP

2015/10/09 51 users お好み かゆい所 ウェブサイト カスタマイズ機能 差別化

これからウェブサイトを作成するときに、利用を検討したい高品質な無料WordPressテーマをまとめています。かゆい所に手が届く、お好みのカスタマイズ機能や、他サイトと差別化を図るデザイン性が充実したテーマが多く揃っています。ウェブサイトにボタン一つでテーマを有効化できる、便利さもWordPress人気の秘密かもしれません。 詳細は以下から。 無料なのに高品質！Webサイト制作が捗る無料WordPr... 続きを読む

シンプルなWebサイト制作におすすめ！最新フリーアイコン素材まとめ 2015年9月度 - PhotoshopVIP

2015/09/09 66 users PhotoshopVIP

シンプルでどんなWebデザインにも合わせやすい、無料ダウンロードできる最新アイコン素材をまとめています。 飽きのこない万能アイテムから、2015年のデザイントレンドを反映したアウトラインやフラットスタイルの素材など、幅広いデザインをコレクションしています。PhotoshopやIllustratorはもちろん、利用ユーザーの増えているSketchで使える素材など、どれもファイル形式を記載していますの... 続きを読む

ロイヤリティフリー！無料で使える高品質なライン系アイコン素材まとめ | 株式会社LIG

2015/06/03 74 users ロイヤリティフリー モモコ 株式会社LIG ライセンス センス

こんにちは、デザイナーのモモコです。 今回はWebサイト制作には欠かせないアイコン素材の中から、線で構成されたライン系アイコンをまとめてご紹介します。 いずれもロイヤリティフリーで使用できるものを集めましたが、利用許諾範囲については各配布先のライセンスを必ずご確認下さい。 センスが光る！おしゃれなライン系アイコン9選 ego-icons http://ego-icons.com/ 六角形を基にした... 続きを読む

Webサイト制作の中心に分析を！Ptengineの便利な機能と使い方【導入編】 | 株式会社LIG

2015/03/19 75 users Ptengine 株式会社LIG 分析 導入編 中心

こんにちは。LIGのアートディレクターの長岡です。 Webサイト改善のためにGoogle Analyticsなどのアクセス解析ツールを使って、数値を分析している方は多いのではないでしょうか。 ツールを使いこなせば、それなりに問題点や課題も見つかるようになるのですが、どうしても数値からでは判断できないこともあります。 そんなときに利用したいのがヒートマップツールでしょう。 アクセス解析と合わせてヒー... 続きを読む