sitateru tech blog: Design

sitateru tech blog

シタテルの技術やエンジニアの取り組みを紹介するテックブログです。

ラベル Design の投稿を表示しています。 すべての投稿を表示
ラベル Design の投稿を表示しています。 すべての投稿を表示

2019年1月28日月曜日

WEBエンジニアが知っていてもいいかもしれない出版やデザインの話

1月 28, 2019
こんにちは、シタテルでエンジニアをやっている茨木です。

私は出版・DTPをかじったことが少しだけあるのですが、デザインや文章校正の基礎知識はエンジニアの仕事でも活用できる機会が時折あったりします。

基本的なキーワードだけ簡単にご紹介します。
興味がでたらぜひ本格的なデザインや文章校正の本などで調べてみてください。
少し気にするだけでも、画面が結構「それっぽく」なりますので、コスパの良い知識だと思います。

ジャンプ率

1画面(1紙面)でのフォントサイズの変化率を指す言葉です。

一般に、落ち着いた雰囲気にしたい場合はジャンプ率を小さく、派手な印象を与えたい場合はジャンプ率を高くすべきと言われています。

色の指定方法

RGB

WEBエンジニアがまず思いつくのはこれかと思います。光の三原色ですね。

HSB

色相(Hue)、彩度(Saturation)、明度(Brightness)の3要素で色を指定する方法があります。
色相は赤系・青系などの色味、彩度は鮮やかさ(小さいほどグレーに近くなる)、明度は明るさ(小さいほど黒に近くなる)を表します。

SBを固定し、Hのみを変動させることで、比較的まとまりのある色のバリエーションが作りやすいです。

例えば、画面上でステータスAとステータスBの表示色を変えて視認性を上げたい、といった場合には、色相のみ違う2色を用いると、比較的おさまりが良かったりします。

CMYK

インクの4色です。基本的に印刷物の色味はCMYKで表現されます。
WEBだと気にする機会はあまりないですが、RGBやHSBで表現できる色は、必ずしも同じ見え方のCMYKに変換できない、という点は知っておいてもいいかもしれません。

人物写真の「首切り」

インタビューに添付される人物写真において、人物の顔部分に背景の直線(窓枠等)が被る構図はNGとされています。

必ずしも合理的な理由はない(私が知る限りでは)ですが、確かにちゃんとしたサイトや紙面の写真では見ない構図ですから、気にしておくといいかと思います。

文章の書き方

表現したい内容によって正しい日本語の書き方というのは当然変わりますが、かっちりした文章を書く場合には新聞ルールを参考にすると、素人感が出なくていいです。

  • 「出来る」と「できる」はどちら?
  • 「行なう」と「行う」はどちら?
  • 「〜です(〜)。」「〜です。(〜)」はどちら?

たとえばこういう疑問に対して、どっちがプロっぽいか、という回答を与えてくれます。

文献としては共同通信社の記者ハンドブックなどがメジャーですが、買うと高いので、新聞社サイトの文章を参考にするなどでもいいかもしれません。


以上です。散文になってしまいましたが、ご参考になれば幸いです。