ペンギン64からのお知らせや雑記
にほんブログ村 イラストブログ キャラクターデザインへ

2015年09月11日

レスポンシブWebデザイン だ!

ペンギン64 http://pen64.com/
どうぶつキャラクターがワクワク暮らす国の様子をお送りするサイトです。
レスポンシブWebデザインにしたわけです。
新規ページと更新ページから実装していきます。

ただ、ページ数が増えたのでもう、
全部のページをReデザインはできません。

ウェブデザイン 

パソコンなど大きな画面用
スマートフォンサイズそれぞれに合わせて、
レイアウトが変わります。
HTML5やCSS3自体は同じものなので、
URLはもちろんどちらも同じになるわけです。

ところで、
レスポンシブWebデザイン って
異なるデザインを頭で想像しながら
一つのHTML5とCSS3を打ち込んでいるのですが、
これたいへんだなぁ。
今までのウェブデザインを行う思考が二倍になる感覚。
打ち込んで実際にブラウザで見ると、直したいポイントがあるので直すと、
スマートフォン用デザインのほうがズレてしまったり。
やり始めたときはそんな事が何度も・・・。
慣れてはきましたが、従来より気を遣うポイントは増えてる。

ンでもって、
いろんなブラウザで見てみました!


ウォークマンでもウェブデザインばっちり

スマートフォンというか、android搭載ウォークマンでもウェブデザインばっちり見れてます


ニンテンドー3DSでブラウジング

ニンテンドー3DSでブラウジング


PSvitaでブラウジング

プレイステーションVITAでも


WiiUでもばっちりウェブデザイン

WiiUでもばっちりウェブデザイン


んでは。
一通りちゃんと見れるようになって、一安心です。
おやすみなさい。

posted by フシュル at 02:03| Comment(0) | TrackBack(0) | ペンギン64からお知らせ

2015年09月09日

ボーカロイドのRana お誕生日おめでとうございます!!

ボーカロイドのRanaちゃん
お誕生日おめでとうございます〜!

ボカロPになりたい!VOL1
https://www.rana0909.jp/
発売からもう1年なんですね。
ここまで、VOL26まで購入しているのですが、追いついてないです。
遅れても全30冊学び、曲完成させる。

というわけで、ボカロ作品でお祝い出来たらよかったけどね。またいつか!

・・・
・・・・・・・・
・・・・・・・・・・・・・

どうぶつの森のRana4
どうぶつの森のRana1
どうぶつの森のRana5

ニンテンドー3DS どうぶつの森
ボーカロイドのRanaの服を作りました。

どうぶつの森のRana7

髪型と髪色も合わせているよ!
かわいい!!

デザイン配布QRコードも載せますねコチラ↓
みんなでRanaちゃんになろう〜♪

どうぶつの森のRanaQRコード1
どうぶつの森のRanaQRコード2
どうぶつの森のRanaQRコード3
どうぶつの森のRanaQRコード4

来年はボカロソングでお祝い出来たらイイな。

#Rana生誕祭2015
#vocaloid_Rana

posted by フシュル at 00:01| Comment(0) | TrackBack(0) | 雑記

2015年07月21日

7月

ペンギン64
アクセス解析見たらアクティブユーザーが「15」ってなっていて、
自分でもびっくり。せっかく閲覧しに来てくれているので、
楽しんでいただけるように、頑張って更新したい。

15.gif


( ※ アクティブユーザー:現在閲覧中の人数 )

気持ちだけで、全然進まないのですが

続きあります
posted by フシュル at 17:17| Comment(0) | TrackBack(0) | 雑記

2015年06月22日

スマートフォン向けに対応(ひとまず)

ひとまずトップページだけですが、
スマートフォン向けレイアウトに対応完了しました!

スマートフォンで見たイメージ↓
スマートフォンに対応


パソコン(フルブラウザ)で見たイメージ↓
スマートフォンに対応(PCデザイン)


スマホとPCを別々のサイトにしてみたり、
サーバーサイドで振り分ける形にしたり、検証して、

そして、一回いいところまで、作ったのですが、
あと一工夫が思い通りの表現が出来なくて、作り直したりしてました。
思うと、かなり時間かかってしまった。

ちなみに、
CSS3HTML5を駆使した、
フレキシブルデザインになりましたので、
PCからご覧の方は、ウィンドウ幅を狭くすると、
スマートフォン向けデザインが見れますよ。

まだ思うところが有りますので手を加えていきますが、ひとまず安心。
次はイラストに手をまわしたいなっ。
posted by フシュル at 11:48| Comment(0) | TrackBack(0) | ペンギン64からお知らせ

2015年05月30日

当サイトの予定


けっこう前から、
このサイト「ペンギン64」を
スマートフォン向けの表示対応させようと、
試行錯誤して居たりします。



レイアウト1.png



携帯端末用にページを最適化するというと、
携帯電話(ガラパゴスケータイ・ガラケー)の時を思い出します。



ガラケー思い返せば、
出来る事が限定されて、
故にデザインの幅も限られるから
そんなに手間なく作れるのかと思ってましたが、



実際は考える事が多かった・・
AUの端末の場合は・・・、docomoの端末なら・・・、
新しい機種ならできるけど、古い機種のことも考えてー。
ページ確認は実機で確認すべきだけど、現行1機種しか所有してないし。
通信料かかるしー。




私には作りにくかった・・・・



レイアウト2.png



スマートフォン向けに手を付け始めて、
PC用のページを作る時とは、やはり感覚違うところ、
スマートデバイス向けならではの表現はあるものの、
機種や世代ごとの違いにあまり悩まず作っていけてやりやすい。



試行錯誤もだいぶ繰り返し、
ようやく、このサイトでのスマートフォン対応の方向性が見えてきた感じ。
時間があれば、こういうことをしているのでこれが完了しないと、
通常の更新(イラストやコンテンツの追加とか)が行えないのがネックですがー。
ゆっくりかもしれませんが、毎日ちょっとずつ対応完了に向けて進めます。



というわけで、まだまだお待ちを。

posted by フシュル at 07:00| Comment(0) | TrackBack(0) | 雑記