曲線的なデザインへのこだわり

Design

今回の記事は、Eva Schickerさんによる、「The love of curvilinear design」という記事の翻訳版となります。

直線だけのデザインは角ばっていて、どこか冷たさを感じますが、曲線には柔らかさや優美さを感じることができると思います。そのような曲線という形にフォーカスしてみてみると、あなたが何かを生み出す時に今までになかった視点が出てくるかもしれません。

オリジナル記事はこちらから⏬
https://uxdesign.cc/the-love-of-curvilinear-design-c32add2a77b9

・・・・・・・・・・・

Fluorescent cloud shapes rendered through overlays of colors.
色の重ね合わせで表現される蛍光色の雲の形。

Curvilinear:曲線を含む、または曲線からなる (ケンブリッジ辞典)

あなたも筆者のEvaさんと同じように、ソフトでオーガニックな形がプロダクトデザインにおける流動体お好きですか?正方形をデザインするたびに、角に半径を追加して、より流動的な形状にすることに気がつきましたか?

デザイナーとして幸運なことに、曲線的なデザインは注目すべきトレンドになっています。

エンドレス・カーブの秀逸な例

The London staircase

ロンドン市庁舎の内部螺旋階段は、無限とも思える曲線を使った優れた建築例です。

Looking up at the spiral staircase in City Hall, London. Image by ©Colin / Wikimedia Commons.
ロンドン市庁舎の階段を見上げるとこんな感じ。©Colin / Wikimedia Commons

この螺旋状の通路は全長500メートルで、10階建てのビルの縦断面を覆っています。最上部には、一般向けの展示スペースがあります。この建物は、先見性のあるモダニスト建築家ノーマン・フォスターが設計しました。彼はノーマン・フォスター財団の創設者でもあるほか、Apple storeのデザインでも有名です。建築家、デザイナー、都市計画家など若い世代に学際的な思考を促すことが、フォスターの未来像であり、すべてのデザイナーの夢なのだそうです。

言うまでもなく、螺旋階段の構成は、見るだけでクリエイターに多くのインスピレーションを与えてくれます。曲線と丸みを帯びたフォルムは、視線を無限の空間へといざないます。

デザイナーとして、デジタルな流動的な形をどのように作り出せば良いのでしょうか。

最も基本的なデザインは、流れるような形状に適応することができます。四角いものを丸くするのも、それほど難しいことではありません。

A square morphing into a soft-edged shape.
正方形がソフトエッジに変形したもの。Appleのデザインではよく見ますね。

同様に、柔らかい形が有機的な形に変わることもあります。

Simple organic shapes rendered by haikei.app.
haikei.appによるシンプルな有機的形状のレンダリング

haikei.appは、数回のクリックで、豊富な有機的な形状をウェブ対応のpngまたはsvgファイルとしてレンダリングすることができます。

レンダリングできるのは単に図形だけではありません。 波、海、風景の起伏、その他の流動的な形態といったような、多数の曲線的な構成を表現することも可能です。カラーパレットはカスタマイズ可能で、コントラストやレイヤー数はユーザーが設定することができます。

柔らかな風景

カーブには微かなものと複雑なものがあります。波数、複雑さ、コントラストはすべて、曲線的な環境の特徴を定義するために追加されます。これは、背景として、イラストレーションとして、あるいはパターンデザインとして使用することができるでしょう。

Three undulating green landscapes with varying intensity of complexity and wave count. Made with haikei.app.
haikei.appで作成した複雑さ、波数が違う3つの起伏に富んだ緑の風景
蛍光色を使用した曲線による雲の形状

曲線的なデザインシェイプは、宝石のようなオブジェクトを表現するのに適しています。Photoshopでは、「ぼかし」「ゆがみ」「傾き」などの効果フィルターを使い、「ビビッドライト」などのレイヤー効果でさらに加工することで、素晴らしい効果を作り出すことができます。

Three varying soft, rainbow-colored shapes seemingly floating in space like dew drops.
虹色の柔らかな3つの形は、まるで露のように空間に浮かんでいるように見えます。

北の空に輝くオーロラを彷彿とさせるような、どこからともなく現れる流麗な風景を作成することが可能です。
これは、アクセントカラー、背景、バックグラウンドとして、色鮮やかな要素を足してみてください。

螺旋の曲線からのインスパイア

螺旋階段のように、螺旋状のデザイン要素は、有機的なデザインオブジェクトとして魅力的です。

フィボナッチと、彼が中世の数学者として研究した不思議な数字について聞いたことがあるかもしれません。フィボナッチが1200年頃に発見したこの数字は、長方形や螺旋における黄金比、生命、さらには全宇宙への鍵となりました。フィボナッチと彼の黄金の螺旋に関する非常に興味深い逸話は、こちらからお読みください。

この話には、ユーザーの入力に従って螺旋状のベクター形状をレンダリングするAdobe Illustratorの特殊な螺旋描画機能を参照しています。

特に装飾デザインにおいて、螺旋状のデザインパターンは、その流動性と容易にエレガントさを生み出すことができるため、よく使用されています。

Two spirals mirroring each other forming a face-like structure.
2つの螺旋が鏡のように重なり合い、顔のような構造になっています。
A variation of a spiral motif.
螺旋構造にもっとメリハリをつけてみると…
プロダクトデザインにおける流動体

流動的なデザインオブジェクトから多くのインスピレーションを得ることができます。以下の図の彫像は一見すると深海の地層のような、化石のような…見え方をすると思います。その形は魅惑的であると同時に、落ち着きを与えてくれます。一点でも直線でもない、擬似生物のような造形が見せる起伏と空間が私たちの心を惹きつけるのです。

A photo of a hanging mobile made of round metal shapes. Artist unkown.
Artist unkown
まとめ
  • 曲線的なデザインの構成要素により、無限のバリエーションを得ることができる。
  • 流動的な形状は、有機的な環境として表現しやすい。
  • 構成的なソフトランダムオブジェクトは、空間的な要素としてよく表現される。

参考文献及びリンクはこちらから

Haikei: 指定した2色のデザインパレット上で、曲線などのデザイン要素をカスタマイズしながらレンダリングすることができます。
Squircley: 数回のクリックで有機的形状を作成し、svgまたはpngとしてダウンロードできます。
Fibonacci: 螺旋の黄金比の発掘とその描き方

・・・・・・・・・・・

本日の記事は以上となります。

デザインの中に曲線を組み込むことで、無機質な印象から有機的かつバリエーション豊かなデザインオブジェクトを構成することができるようになることがお分かりいただけたかと思います。

今日はこの辺りで終わりにしたいと思います。
それではまた!

Source:https://uxdesign.cc/the-love-of-curvilinear-design-c32add2a77b9

コメント

タイトルとURLをコピーしました