あやこのWebデザイン奮闘記
就活用ポートフォリオサイトの制作過程を載せていくwebデザイナー志望のあやこのブログ。
×
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
随分とまた、長い間更新していませんでした、当サイトとブログですが、
元々このサイトは絵などのポートフォリオ代わりにと作っていましたが、ここ最近はSNS等で手軽に絵がアップロードできたりしますので、いざサイトに載せるとなるとデータや当時の状況など、今では思い出せないものが沢山存在し、億劫になってしまい結局ページ更新に至っておりません。
また、途中からHTMLを本格的に学び始め、HTMLのタグうちでサイトが作れるという、アピールのために作って今したが、このページ自体がレスポンシブ化しておらず、また途中でJQueryが面白くなってしまい、結構ランダムに使いまくるという、ちょっとアレなサイトになってしまっていました。
そうしてしばらく仕事でてんやわんやしており、またしても病んでしまい、なんだかんだで期間満了で8月末で退職していました。
そしてそれから就活を再び始めたのですが、このサイトがとても中途半端な状態で放置していたことに、今更ながら気づきました。←
なので、本日即席ですが、xhtml形式で書いていたタグを一新HTML5に致しました。
実際外側からの見た目は一切変わっていません。
中身だけです。
あとは、少し近況やコピーライトのみちょこちょこっといじっております。
作品掲載ページはまあ、あくまでHPつくれるよーアピールの為だけの仮のページだと思っていただければと思います。←
今後自分が本格的にwebデザイナーになれるかまでは分かりませんが、今よりもっとHTMLを簡単にいじくれるようになれば、このサイトも少し変化するかもしれません。
どちらかと言うと、ハンドメイドのサイトの方が今後きちんと動かしていこうと考えていますので、そちらやツイッターで近況など確認していただければと思います。
そうそう、ツイッターなんですけど、あるのにこのサイトには埋め込みしていないというw
ハンドメイドにはツイッターとインスタのアカウント埋め込んであります。
個人の方ではないですが。
ハンドメイドは親友と二人でやっているものですので、親友の方の作品・商品も是非みてあげていただけたらと思います。
動物・食べ物の絵がものすごく上手いんですよ!
食品サンプルも好きなようですが、彼女自身はそこまで細かいものは作れないようですが、昔見せてもらったお寿司やお鍋の粘土で作ったオブジェは、とてもよくできていたと思うんですけどね~。なんだか才能持て余しててもったいない。
そういうのもあり、ハンドメイドは、私よりその親友の絵を売れる方向へ持っていきたくて、彼女も本当はイラストレイターとかそういう職で食べていきたいそうなので、もっとうまくアピールできないものかと試行錯誤しています。
あくまで私はプロデュース側で関わろうと思っていたのですが、肝心の親友はイマイチ本格稼働してくれないので(仕事がしんどいのかもしれないですが・・・/汗)困ったものです。←
まあ私も人の事言えませんが。
そんなこんなで長く色々書きましたが、こんな状況でした。
次またいつ書くか不明ですが、何かしら書く事があれば、このブログに出没しますのでそれまで。(多分誰も待ってない/笑)
元々このサイトは絵などのポートフォリオ代わりにと作っていましたが、ここ最近はSNS等で手軽に絵がアップロードできたりしますので、いざサイトに載せるとなるとデータや当時の状況など、今では思い出せないものが沢山存在し、億劫になってしまい結局ページ更新に至っておりません。
また、途中からHTMLを本格的に学び始め、HTMLのタグうちでサイトが作れるという、アピールのために作って今したが、このページ自体がレスポンシブ化しておらず、また途中でJQueryが面白くなってしまい、結構ランダムに使いまくるという、ちょっとアレなサイトになってしまっていました。
そうしてしばらく仕事でてんやわんやしており、またしても病んでしまい、なんだかんだで期間満了で8月末で退職していました。
そしてそれから就活を再び始めたのですが、このサイトがとても中途半端な状態で放置していたことに、今更ながら気づきました。←
なので、本日即席ですが、xhtml形式で書いていたタグを一新HTML5に致しました。
実際外側からの見た目は一切変わっていません。
中身だけです。
あとは、少し近況やコピーライトのみちょこちょこっといじっております。
作品掲載ページはまあ、あくまでHPつくれるよーアピールの為だけの仮のページだと思っていただければと思います。←
今後自分が本格的にwebデザイナーになれるかまでは分かりませんが、今よりもっとHTMLを簡単にいじくれるようになれば、このサイトも少し変化するかもしれません。
どちらかと言うと、ハンドメイドのサイトの方が今後きちんと動かしていこうと考えていますので、そちらやツイッターで近況など確認していただければと思います。
そうそう、ツイッターなんですけど、あるのにこのサイトには埋め込みしていないというw
ハンドメイドにはツイッターとインスタのアカウント埋め込んであります。
個人の方ではないですが。
ハンドメイドは親友と二人でやっているものですので、親友の方の作品・商品も是非みてあげていただけたらと思います。
動物・食べ物の絵がものすごく上手いんですよ!
食品サンプルも好きなようですが、彼女自身はそこまで細かいものは作れないようですが、昔見せてもらったお寿司やお鍋の粘土で作ったオブジェは、とてもよくできていたと思うんですけどね~。なんだか才能持て余しててもったいない。
そういうのもあり、ハンドメイドは、私よりその親友の絵を売れる方向へ持っていきたくて、彼女も本当はイラストレイターとかそういう職で食べていきたいそうなので、もっとうまくアピールできないものかと試行錯誤しています。
あくまで私はプロデュース側で関わろうと思っていたのですが、肝心の親友はイマイチ本格稼働してくれないので(仕事がしんどいのかもしれないですが・・・/汗)困ったものです。←
まあ私も人の事言えませんが。
そんなこんなで長く色々書きましたが、こんな状況でした。
次またいつ書くか不明ですが、何かしら書く事があれば、このブログに出没しますのでそれまで。(多分誰も待ってない/笑)
PR
おひさしぶりです。
今、とあるバイト試験の一環の研修をからこれ3ヶ月くらいしているのだけど、
そこで出された課題が、一度コーディングしたPCサイトのスマホ版を作るというもの。
スマホ版をデザインする際に、どうしてもIDやClass名を変更しないといけない事態が生じた。
それを経験し、PC版からつくる時も、常にスマホ版の事を考えて、ほぼ同じID・Class名でも書き換えが効くように作る必要性を感じたのです。
なるべくDiv毎にごそっと入れ替え出来るような構造が良いですね。
CSSだけの制御で配置換え出来るデザインを考えられるよう、日々頑張ってゆきたいところです。
そして今回、スマホページをデザインする際、よく見る三本線のアイコンにメニューが隠れている構造に挑戦しようと思い、そのようなデザインにしてみました。
アイコンそのもののデザインは、同じマークが2個重なっていて、見た目も現状おかしいので、FBのアイコンみたいに差をつける必要性がありそうですが、そこはひとまず後回しで作っています。
で、現状一つ、jqueryでみつけたsidrというもので作ってみたのですが、思ってたデザインのようにはいかなかったのです。
私のデザインでは、ヘッダーを2重にして、上のヘッダーと下のページを残してその上に横からメニューをスライドさせたデザインでした。
中々そのような動作のものが見つからず、かなり検索しまくってやっと、下のようなものを発見したしました。
↓
http://tympanus.net/Tutorials/GoogleNexusWebsiteMenu/
しかしこれってグーグルの公式なんでしょうか?
設置方法やカスタムも日本語では見当たらなかったのでボチボチ訳しつつ次回研修時に設置してみようと思います。
途中経過の日記で結果もなく、面白味のない記事で申し訳ございません…(汗;)
また、入れてみて、どういう結果になったかは今度記事にしようと思います。
それでは、午後からは未経験でもOKな派遣の登録会にいってきます。
今、とあるバイト試験の一環の研修をからこれ3ヶ月くらいしているのだけど、
そこで出された課題が、一度コーディングしたPCサイトのスマホ版を作るというもの。
スマホ版をデザインする際に、どうしてもIDやClass名を変更しないといけない事態が生じた。
それを経験し、PC版からつくる時も、常にスマホ版の事を考えて、ほぼ同じID・Class名でも書き換えが効くように作る必要性を感じたのです。
なるべくDiv毎にごそっと入れ替え出来るような構造が良いですね。
CSSだけの制御で配置換え出来るデザインを考えられるよう、日々頑張ってゆきたいところです。
そして今回、スマホページをデザインする際、よく見る三本線のアイコンにメニューが隠れている構造に挑戦しようと思い、そのようなデザインにしてみました。
アイコンそのもののデザインは、同じマークが2個重なっていて、見た目も現状おかしいので、FBのアイコンみたいに差をつける必要性がありそうですが、そこはひとまず後回しで作っています。
で、現状一つ、jqueryでみつけたsidrというもので作ってみたのですが、思ってたデザインのようにはいかなかったのです。
私のデザインでは、ヘッダーを2重にして、上のヘッダーと下のページを残してその上に横からメニューをスライドさせたデザインでした。
中々そのような動作のものが見つからず、かなり検索しまくってやっと、下のようなものを発見したしました。
↓
http://tympanus.net/Tutorials/GoogleNexusWebsiteMenu/
しかしこれってグーグルの公式なんでしょうか?
設置方法やカスタムも日本語では見当たらなかったのでボチボチ訳しつつ次回研修時に設置してみようと思います。
途中経過の日記で結果もなく、面白味のない記事で申し訳ございません…(汗;)
また、入れてみて、どういう結果になったかは今度記事にしようと思います。
それでは、午後からは未経験でもOKな派遣の登録会にいってきます。
バイトを始めたのです。
写真スタジオのレタッチ+デザイン作業ですね。
web関連ではないものの、画像補正の技術やらをスピードアップさせつつお金を稼ぐ一石二鳥のバイトです。
webデザイナーしたい人は一度は経験しておくといい職かもしれません。
そして、今回久々にブログを書いたのには訳があります。
現在制作中の29てぃるのサイトですが、徐々に進んできたものの、なぜかlightboxが効かなくて困っているわけです。
なぜか画像だけが表示され、ページの上に黒い半透明の背景のある画像表示状態にはならないのです…。
以下がHTMLタグです。
<!--スタイルシート-->
<link rel="stylesheet" href="./css/lightbox.css" type="text/css" />
<link href="./css/style.css" type="text/css" rel="stylesheet" />
<!--スタイルシートここまで-->
<!--ヘッド内のスクリプト-->
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<!--ヘッド内のスクリプト-->
<!--body内のaタグ-->
<a href="./img/prof/c/ck1.jpg" rel="lightbox[ck]" title="絵画1:ベニヤ板×油彩">1</a>
<!--body内のaタグ-->
lightboxのCSSには、きちんとNext prevの画像urlも直してあるのに・・・。
フォルダ階層も合ってるはずだし、よくわからん・・・。
先生に聞いてみても入れ方は合ってるそうです。
が、なぜかそうなる。
困ったもんだ・・・。
別の先生の協力のもと、試行錯誤の結果、
<body>
<!--body内のaタグ-->
<a href="./img/prof/c/ck1.jpg" rel="lightbox[ck]" title="絵画1:ベニヤ板×油彩">1</a>
<!--body内のaタグ-->
<!--body閉じタグ前のスクリプト-->
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<!--body閉じタグ前のスクリプト-->
</body>
で解決しました。
写真スタジオのレタッチ+デザイン作業ですね。
web関連ではないものの、画像補正の技術やらをスピードアップさせつつお金を稼ぐ一石二鳥のバイトです。
webデザイナーしたい人は一度は経験しておくといい職かもしれません。
そして、今回久々にブログを書いたのには訳があります。
現在制作中の29てぃるのサイトですが、徐々に進んできたものの、なぜかlightboxが効かなくて困っているわけです。
なぜか画像だけが表示され、ページの上に黒い半透明の背景のある画像表示状態にはならないのです…。
以下がHTMLタグです。
<!--スタイルシート-->
<link rel="stylesheet" href="./css/lightbox.css" type="text/css" />
<link href="./css/style.css" type="text/css" rel="stylesheet" />
<!--スタイルシートここまで-->
<!--ヘッド内のスクリプト-->
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<!--ヘッド内のスクリプト-->
<!--body内のaタグ-->
<a href="./img/prof/c/ck1.jpg" rel="lightbox[ck]" title="絵画1:ベニヤ板×油彩">1</a>
<!--body内のaタグ-->
lightboxのCSSには、きちんとNext prevの画像urlも直してあるのに・・・。
フォルダ階層も合ってるはずだし、よくわからん・・・。
先生に聞いてみても入れ方は合ってるそうです。
が、なぜかそうなる。
困ったもんだ・・・。
別の先生の協力のもと、試行錯誤の結果、
<body>
<!--body内のaタグ-->
<a href="./img/prof/c/ck1.jpg" rel="lightbox[ck]" title="絵画1:ベニヤ板×油彩">1</a>
<!--body内のaタグ-->
<!--body閉じタグ前のスクリプト-->
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<!--body閉じタグ前のスクリプト-->
</body>
で解決しました。
広告
自分用リンク
便利サイトから友人サイト・お気に入りサイトまでごちゃまぜ。
アマゾンの本
己
HN:あやこ
年齢:38
性別:女性
誕生日:1986/02/18
職業:無職
趣味:何かを作るという事
自己紹介:2008年芸大卒業後、就職するもソフトの知識がなくや業務はデザイン以外の出荷業務や雑務が多く2009年7月には退職。
専門知識を得るべく選んだのは3DCG映像制作。
2009年10月よりデジハリにて映像を学び2010年に卒業後、アルバイトをしながらポートフォリオを制作しようとするものの、アルバイトの方が忙しくポートフォリオの制作ができないまま半年を過ごしてしまう。
2011年3月にバイトを辞めポートフォリオ制作をし、就活を始めるも中々決まらないまま月日は過ぎていってしまう。
2012年12月にようやく遊技機のオーサリングデザイナー職で東京の会社に受かる。 契約社員にて勤務。
仕事はしんどいものの東京生活はなかなか楽しく2年間が過ぎ、2014年12月にて期間満了になり大阪へ戻ってきました。
遊技機での映像制作は派手さをいう面で合わないと判断し、デザイン職での就職を目指し、大阪の会社でアルバイトを2015年1月から始める。
しかしこちらも業務が忙しく、梱包作業や取材等、何から何までしないといけない会社だったため3月には辞め、その後就活を再開。
ひとつきほど仕事を探してみて、webデザインなどができるデザイナーの募集が結構あることに気づき勉強することを決める。
2015年4月より専門学校に通い、現在就活中。
専門知識を得るべく選んだのは3DCG映像制作。
2009年10月よりデジハリにて映像を学び2010年に卒業後、アルバイトをしながらポートフォリオを制作しようとするものの、アルバイトの方が忙しくポートフォリオの制作ができないまま半年を過ごしてしまう。
2011年3月にバイトを辞めポートフォリオ制作をし、就活を始めるも中々決まらないまま月日は過ぎていってしまう。
2012年12月にようやく遊技機のオーサリングデザイナー職で東京の会社に受かる。 契約社員にて勤務。
仕事はしんどいものの東京生活はなかなか楽しく2年間が過ぎ、2014年12月にて期間満了になり大阪へ戻ってきました。
遊技機での映像制作は派手さをいう面で合わないと判断し、デザイン職での就職を目指し、大阪の会社でアルバイトを2015年1月から始める。
しかしこちらも業務が忙しく、梱包作業や取材等、何から何までしないといけない会社だったため3月には辞め、その後就活を再開。
ひとつきほど仕事を探してみて、webデザインなどができるデザイナーの募集が結構あることに気づき勉強することを決める。
2015年4月より専門学校に通い、現在就活中。