タグ

ブックマーク / ponsyon.com (2)

  • アイソメトリック研究 番外編|CSSのtransformプロパティでアイソメできるかな? | yanagi's memo

    アイソメトリック図法とは等角投影図とも呼ばれ、立体を斜め上から見た状態の表現方法です。等角というだけあって、ここが全て等しく120°(下図参照)。また座標の軸がともに30°傾いています。建築やテクニカルイラストで使用されていますが、WEBデザインのトレンドになったことでWEB上でもよく見かけるようになりました。アイソメ図と略されていたりします。step1:アイソメトリック図法のガイドとなる升目を作成するまずは作図のためのベース作りです。長方形グリッドツール(直線ツールのあたりにある)を選択した状態でドキュメント... 上記の記事でも触れていますが、アイソメトリック図法とは厳密に言えば図のようにx軸、y軸に30度、30度です。見せるのに適した角度は図とデザインにもよるのですが、実装の目安として丁度良いのでこの角度を目指します。 また、アイソメトリックといえば上面、右面、左面とありますが、まず

    アイソメトリック研究 番外編|CSSのtransformプロパティでアイソメできるかな? | yanagi's memo
  • Illustrator アイソメトリック図法研究① | 基礎編 – ガイド作成と数値 | yanagi's memo

    アイソメトリック図法とは 等角投影図とも呼ばれ、立体を斜め上から見た状態の表現方法です。 等角というだけあって、ここが全て等しく120°(下図参照)。また座標の軸がともに30°傾いています。 建築やテクニカルイラストで使用されていますが、WEBデザインのトレンドになったことでWEB上でもよく見かけるようになりました。 アイソメ図と略されていたりします。 step1:アイソメトリック図法のガイドとなる升目を作成する まずは作図のためのベース作りです。 長方形グリッドツール(直線ツールのあたりにある)を選択した状態でドキュメント内をクリックすると「長方形グリッドツールオプション」が開きます。 幅と高さを同じ数値に、分割の線数も水平・垂直同じ数値にします。分布は0%のまま。 下のオプションは両方外してOK。

    Illustrator アイソメトリック図法研究① | 基礎編 – ガイド作成と数値 | yanagi's memo
  • 1