2012-05-01から1ヶ月間の記事一覧

楕円形ツールでロゴを描く

移動コマンドで数値を入れた移動コピー Ctrl+Shift+M(move) ダイレクト選択ツールで移動、アンカーに重ねる [left:w400]

長方形ツールでロゴを作る

基本の長方形を、コピーして使うことで一貫性がでる 基本の長方形に、整列させる。 web用に保存するときのサイズ 目的サイズの長方形をアートボードに変換 アートボードパネルのオプションからサイズ変更 アートボードサイズでクリップオプション

線のバリエーション

線を重ねる テキストや線には、線や塗りを重ねてバリエーションを作ることが出来る 作った物をグラフィックスタイルで保存し、また使える。

イラストレーターのフォントの輪郭の強調

テキストに、アピアランスで塗り・線を重ねる 線幅のない塗りだけのもの(文字がつぶれないように) 線幅の狭いもの(縁取り)→線角:ラウンド形状 形状によっても違いが出来る 広い線幅のもの(縁取り)→線角:ラウンド形状 ドロップシャドウなどの効果を重ねる 上…

フォントの輪郭の強調

テキストに、アピアランスで塗り・線を重ねる 線幅のない塗りだけのもの(文字がつぶれないように) 線幅の狭いもの(縁取り)→線角:ラウンド形状 形状によっても違いが出来る 広い線幅のもの(縁取り)→線角:ラウンド形状 ドロップシャドウなどの効果を重ねる 上…

線のバリエーション

線を重ねる テキストや線には、線や塗りを重ねてバリエーションを作ることが出来る 作った物をグラフィックスタイルで保存し、また使える。

長方形ツールでロゴを作る

基本の長方形を、コピーして使うことで一貫性がでる 基本の長方形に、整列させる。 web用に保存するときのサイズ 目的サイズの長方形をアートボードに変換 アートボードパネルのオプションからサイズ変更 アートボードサイズでクリップオプション

楕円形ツールでロゴを描く

移動コマンドで数値を入れた移動コピー Ctrl+Shift+M(move) ダイレクト選択ツールで移動、アンカーに重ねる [left:w400]

position

css

基準にするのは何かを指定する(position) 値 基準 条件 影響 static 本来の位置 デフォルト なし relative 本来の位置から 元位置に本来のスペース残る absolute 親要素から 親要素static以外を指定 本来のスペースはなくなる absolute ウィンドウから 親要…

position

基準にするのは何かを指定する(position) 値 基準 条件 影響 static 本来の位置 デフォルト なし relative 本来の位置から 元位置に本来のスペース残る absolute 親要素から 親要素static以外を指定 本来のスペースはなくなる absolute ウィンドウから 親要…

gifアニメとは

gifアニメは数枚のgifが連続したパラパラ漫画。 動く部分と動かない部分の、差で動きを見せる。(全体を動かすと、動きが見えにくくなる) GIFアニメをPhotoshopで作成する Aiのレイヤー(オブジェクトのグループ)→Psのレイヤー(1毎絵に変換)→フレーム 4枚で構…

イラストレーターの特殊パス 複合パス

Command + 8 複合パス ドーナツの穴 文字 1つのパスでは作れない形。複数のパスを組み合わせて1つの形に見せている。

イラストレーターのマスク クリッピング

クリッピングマスク Command + 7 一番上のオブジェクトの形でマスクする。複数の四角形をグループ化したオブジェクトでは、クリッピングマスクに変換できない。 複合パスにしてマスクにする。

クリッピングマスク

クリッピングマスク Command + 7 一番上のオブジェクトの形でマスクする。複数の四角形をグループ化したオブジェクトでは、クリッピングマスクに変換できない。 複合パスにしてマスクにする。

複合パス

Command + 8 複合パス ドーナツの穴 文字 1つのパスでは作れない形。複数のパスを組み合わせて1つの形に見せている。

gifアニメ

gifアニメは数枚のgifが連続したパラパラ漫画。 動く部分と動かない部分の、差で動きを見せる。(全体を動かすと、動きが見えにくくなる) 作り方 Aiのレイヤー(オブジェクトのグループ)→Psのレイヤー(1毎絵に変換)→フレーム 4枚で構成 12枚で構成

CSS18 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS19 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS20 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS21 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS21 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS20 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS19 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS18 横ナビ

見本 ソースコード ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS012縦ナビ

見本 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS13縦ナビ

見本 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS14縦ナビ

見本 :w200] 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS15縦ナビ

見本 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS16縦ナビ

見本 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>

CSS17縦ナビ

見本 例 ブラウザ表示 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>