Design Style

Design Style とは?

Design Style は、Webデザイナーとして勤務していた DesignS(東京都在住) が、Webデザインのポータルサイトを目指して作成していたサービスの名称です。当初は、XOOSでサイトを構築し 1 サイトとして公開していましたが、紆余曲折を経た現在では、Webデザインの内容や形態毎にサイトを分けて公開しています。

Design 0

ブログ形式のWebデザインやWebブラウザなどに関する技術系備忘録

Design 0 は、DesignS が取り組んでいるブログ形式のWebデザインやWebブラウザなどに関する技術系備忘録です。
※現在も継続更新しています。
※第三者である読者を想定した記事ではありません。
※技術評論社の書籍「パーフェクトPHP」8 章に掲載されていたミニブログアプリケーションをカスタマイズしたオリジナルアプリケーション「P7」で作成しています。

3DCG0

ブログ形式の3DCGに関する試行錯誤備忘録

3DCG0 は、DesignS が取り組んでいたブログ形式の3DCGに関する試行錯誤備忘録です。3DCGで作成したオリジナルアニメーション動画も掲載しています。
最終更新年月日は、2015 年 8 月 17 日です。
※今後の更新予定はありません。
※第三者である読者を想定した記事ではありません。
※技術評論社の書籍「パーフェクトPHP」8 章に掲載されていたミニブログアプリケーションをカスタマイズしたオリジナルアプリケーション「P7」で作成しています。

デザイン用語

「デザインで利用される言葉」を集めた用語集

デザイン用語 は、「デザインで利用される言葉」を集めた用語集です。
※今後も更新していく予定です。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P15」で作成しています。

HTML5用語

「HTML5やWebGLで利用される言葉」を集めた用語集

HTML5用語 は、「HTML5やWebGLで利用される言葉」を集めた用語集です。
最終更新年月日は、2019 年 5 月 27 日です。
※今後の更新予定はありません。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P15」で作成しています。

Webデザインの変遷ギャラリー

気になっていたWebサイトのデザインがどう変わっていったかを確認できる変遷ギャラリー

※今後の更新は未定です。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P41」で作成しています。

画面キャプチャ

気になっていたWebサイトの画面キャプチャと感想

※今後の更新予定はありません。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P31」で作成しています。

商用無料日本語フォントランキング

「商用無料」「リンク不要」「漢字O.K.」な日本語フォントを掲載しているページ を一覧にして表示

※今後の更新は未定です。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P45」で作成しています。

pdt

Webデザインなどで使用する画像素材(Public domain 系画像)を、カテゴライズ&タグ付して公開しているWebサービス

Webデザインなどで使用する画像素材(Public domain 系画像)を、カテゴライズ&タグ付けしてまとめて表示するサービスを作成して公開しています(Twitterアカウントがあれば誰でも参加可能です)。
紹介ページ
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P49」で作成しています。

pdt 動作確認用デモ

デモンストレーションサービス

「pdt」へ投稿するとどのようなページを作成できるか、具体例を実際に表示しているデモンストレーションサービスです。「pdt」とは、投稿者が見つけ出してきた「Public Domain 系画像」をカテゴライズしたり、タグ付けすることが出来るサービスです。
紹介ページ
※現在も継続更新しています。
※オリジナルアプリケーション「P7」をカスタマイズしたアプリケーション「P49」で作成しています。

DesignS について(自己紹介)

Webデザイナーとして勤務した後、現在は、個人でWebサービスを作成開発して公開しています。

画像素材に興味を抱いたきっかけは?

Web系の各種学校へ通学していた際、Webサイトを作成する課題がありました。 しかし用意された画像の解像度があまりにひどく取り扱いに苦労したことで、画像素材の大切さに気が付きました。画像 quality に応じて Webサイトの印象が大きく左右されることに、その時初めて気が付きました。

このページの公開日

2020 年 7 月 20 日

このページの最終更新日

2023 年 1 月 17 日

Webデザイン で使用する 画像 をどうやって用意するの? 問題

Webデザイン で使用する 画像 の入手手段は、大きく3 種類あります

クライアントが用意した画像を使用する

データとして画像セットを渡されます。複数枚画像が、1つのディレクトリにまとめられています。色々な角度から撮影した画像などが含まれていることも多いです。平たく言うと「この中から、最も相応しい画像を選んでね」ということです。

自分が撮影に関わった画像を使用する

具体的には、「自分が撮影した画像」あるいは「自分が撮影を依頼した画像」のことです。 依頼時のポイントは、Webデザイン で使用する場面を頭に思い浮かべながら撮影することです。撮影依頼する場合、ただ漠然と「これ撮ってきて」と言うと、後で Webデザイン 作業する際、泣きを見ることもあります。頭の中で画像使用場面を予め思い浮かべた上で依頼することが大事です。例えばこんな感じです。「これ撮ってきて。最低限欲しい内容は、この辺りからこの角度で見上げる形で全体を収めるカットと、ここのフロアのこのロゴのアップと…」…というように、可能な限り言語化した上で具体的に指示を出すことが大事です。

案件に無関係な第三者が撮影した画像素材を使用する

「会社内にある画像素材データ」や、「インターネット等で購入した画像素材」を使用します。ポイントは、どうやって「最適な画像を出来るだけ素早く見つけるか」です。実際に作業してみると分かりますが、想定以上に時間を取られます。

「クリエイティブ・コモンズ・ライセンス」について

公開日

2020 年 7 月 13 日

最終更新日

2020 年 7 月 20 日

「Public domain 画像」と「Public Domain Dedication (CC0) 画像」について

公開日

2020 年 7 月 9 日

最終更新日

2020 年 7 月 20 日