2007/09

ペンツールを学んだよ!

2007/09/30 日曜日 - 22:36:49 by dropdb

物体を切り抜くにはいろいろな方法があるらしいです。
前回は自動選択ツールで物体・人物を切抜きをしましたが
今回は『ペンツール』を使って切り抜いてみました。
さらに、合成にチャレンジしました。
じゃじゃーん!湖に浮かぶチーズケーキです!
結構、リアルにできて満足です。

★学んだこと
ペンツールでの切り抜き
縮小、遠近法
水面への反射で自然に見せる
記事はこちらにあります。

もうレイヤーなんてこわくない

2007/09/28 金曜日 - 07:21:37 by saiso

木曜日です。さいそうです。
自分が起きてる時間までが俺曜日だぜ!と以前けんすうさんあたりが言っていたような記憶がなくもないので、無事木曜日にアップできたということにしてください。ありがとうございます。
いやしかし、こうしてギリギリでもアップしなければと思い、夜な夜なPhotoshopと格闘するというこの現状がまさに100日プログラミングの醍醐味であり僕自身がスキルアップするために必要な状況なのであります。
さて、今回学んだことは以下の通りです。
・レイヤーの基本
・文字入力の基本
・ペンツールとかシェイプツールを使うとその形(パス?)に沿って文字が入力できるよ
・ラスタライズとは…文字データとして認識してある文字を画像に変換することだよ。これによってより効果的な演出が可能になるらしいよ
・横書きマスクツールは文字の形で選択範囲を作ることができる便利機能だよ
さくさくっと、
今回頑張った結果は以下の通りです。
【凝縮画像1】

★ポイント
・海老が背景レイヤーと雲レイヤーの間に入っている!
・dropdbさんオススメのぼかしを使ってエビとその周辺に違和感を無くすように努めた!
・選択ツールに慣れてきた!
・これまでで一番エビをきれいに抜くことができた!
基本はある程度マスターした気になっているので、もう一冊くらい参考書を買って基本の穴を埋めていこうと思います。
次回からこれまではてなでブックマークぽいことをしてきたPhotoshopのTips系なんかも実践していこうと目下検討中です。
おやすみなさい。

トップページを作ったよ

2007/09/26 水曜日 - 20:36:55 by kazuhide

原田です。
今回は「シュリンプミー」のトップページを作成しました。
HTMLとCSSでしこしこと。諸般の事情でいたくトラブルに巻き込まれ、ひどいCSSになってしまいましたが、とりあえず公開。「まずは出す」の精神で。
∵ShrimpME!

デザインもへったくれもない惨憺たる状況ですが、まぁおいおいがんばります。
所要時間:2時間
■広告
Google Adsenseを導入。エビの単語にどうひっかかるかと思いましたが、3つ中、1つがエビ。

それがこのマダムシュリンプというお店@銀座
∵マダムシュリンプ・銀座・丸の内エリア(銀座)他各国料理/飲み会予約
エビ祭りのようなお店です。エビ予算ができれば、いつか行ってみたいものです。
ちなみに、カリフォルニアのマリナデルレイには「シュリンプキラー(キラーシュリンプだったかな?)」というお店があります。そこでは、「シュリンプライス」と「シュリンプパスタ」しかメニューにないという気合に満ち溢れた仕様。まさにエビの桃源郷。
それでは今日はこの辺で。来週こそ、プログラミングを触りたい所存でございます。

デッサンの続き

2007/09/25 火曜日 - 20:49:36 by sokenpico

どんもーっ☆
そうけんぴこです。皆様一週間ごーぶーさーたー。
私がコミケを目指している間に安倍内閣が崩壊したりと、世間ではいろいろあったようですね!
私の愛してる阪神タイガースも、先週の勢いはどこへやら!ウンコチンチン!!
というところで、ええ、練習に精がでますわい。
今回は、最初からマジメに行こうと思いまして、デッサンの続きです。
デッサンとは、
絵の具で面を塗る peinture とは対照的な画法。一般に、ペン、鉛筆、木炭、パステルなどが用いられ、輪郭線(ないし色彩境界線)によって対象の視覚的特徴をつかむことが目的となる。したがって、輪郭線そのものの強弱や太細などが、重要な技法となる。対象に見える明暗や質感・色味・透明感などをハッチングで、さらには水彩彩色で面的に描き込むこともあるが、あくまで付随的である。日本では、面的スフマートまでを含む単なる鉛筆画や木炭画、パステル画などを、その画材のために、誤って「デッサン」と呼んでいる場合が少なくない。(wikipediaより)
ということで、まあ絵を平面として完成させるのではなくて、あくまでも見たまま、そのままを鉛筆だけで立体的に書く練習なのかな、とびこたんは思ってます。
で、わたくし、きちんとしたデッサンを丹誠込めて練習したことなど、キャリアの中に一度もなく、そんなわたくしが、ちゃんとした漫画を書けるのか!と言われると、やっぱり難しいんじゃないかな、と思って、今デッサンの練習をしています。やっぱり基礎が出来る人に私はなりたい!
で、別に先生がいるわけではないのですが、デッサン本を読んで、練習しているところなのです。
先週はとりあえず書いてみた手を公開しましたが、今回はとりあえず書いてみたピーマンを公開します!

同じ角度で同じモノを書いたはずなのに形が違う!
というのがまず下手クソなところなのですが、上のを先に書いて、下のをあとに書きました。
上の方がピーマンっぽい質感がありますね、下の方が形の模写は正しいです。
上のは、線が多すぎて、濃い所が汚くなってしまったので、下は線を少なく、また表面を削るように書く事を意識しました。
それでもさすが4Bの鉛筆、かつ消しゴミはもってないびこたんなので、線が多くなってしまいました。。
鉛筆って味がある画材なので、線が多いとそれっぽく見えてしまうキライがあります。
また、線が多いと、見る人が輪郭を補足してみてしまうので、形の崩れがやっぱりごまかされてしまうのです。
なので、びこたん、次からは線を少なく、それでいて、きちんと形状を表現できるデッサンに挑戦したいと思います!
以上!

PEAR::Pagerが出来るようになったよの巻

2007/09/25 火曜日 - 00:23:54 by kensuu

月曜日担当のけんすうです。
とりあえず、今日は勉強場所の公開を行います。

こんな感じでMacBook+ディスプレイでやっています。下でコード書いて、上で調べ物+動作確認、という形が多いですね。
作業の際にはEclipseを使っています。まだ全然使いこなせていないですが、記述を間違ったらエラーを出してくれたり、入力の補佐をしてくれるので、ケアレスミスが減りました。
初心者が勉強する際に、ケアレスミスは大きな躓きになります。というか、そこで時間がかかりすぎてイヤになってしまうことすらあります。それを回避するのはモチベーションを保つのにいいのではないかと実感しました。
左側には常に本を置いてあります。本を見ながらやる形が多いですね。コピペではなく、必ず自分でコードを書くようにしています。読んでわかる気になるだけではなく、アウトプットをきちんと出さなくてはいけないですね。
そして床にはこのように本を置いています。

ぐわーって並べておいていつでも本にアクセスできるようにします。
本をどう使うか、というのは議論があると思いますが、僕の場合は
1:本は出ているものでよさげなものは全て買う
2:同じことをやるにも、すべての本の説明を読む
というやり方をしています。受験の時もそうでしたが、一つの本の説明を見るより、10冊の本の説明を読んだほうが、いろいろな視点からの説明になるので、わかりやすいのです。
お金はかさみますが、これが今のところ自分には一番あっていますね。
さて、今週勉強したところです。
あまり「ひとり開発ブログは更新していないのですが、やっていたことは、ずばり「PEAR」です。
PEARとは - はてなダイアリー
The PHP Extension and Application Repository
プログラミング言語PHP用のライブラリ集。色々な拡張モジュールやアプリケーションがPEARに登録されており、ネットワーク経由で取得・利用することができる。PerlでいうCPANにあたる。
「ぴあー」だと思われていたが最近「ぺあー」だと判明
これを使えるようになると開発が楽になると聞きました。自分で書かなくていいところは人の書いたものを使う、ということなのかな。
classというのを覚えたので、このあたりに挑戦できるのがうれしいです。
というわけで、書いてみた。使ったPEARは、PEAR::DBと、PEAR::Pagerです。
<?php
$init_obj = new Init_class();

[…]

自動選択ツールを学んだよ!

2007/09/24 月曜日 - 00:15:04 by dropdb

こんにちは!dropdbです。今回は自動選択ツールを学びました。
自動選択ツールとは
クリックした位置に隣接する同系色の範囲を自動的に選択するツールです。
範囲はオプションバーの許容値で調整します。
before

after
自動選択で灰色の背景を選択したあとdeleteを押すと削除することができました。

point
許容値も調整しつつ、境界線をぼかすとより綺麗に人物をきりぬくことができます。

さらに今回はモノクロの仕方まで学んでみました。
今回は背景が単調な色だったので自動選択ツールで切り抜くことができたのですが
次回はもっと複雑な背景から人物を抜き出してみたいと思います。

レイヤーに入るのがこわい

2007/09/21 金曜日 - 00:38:13 by saiso

木曜日です。さいそうです。
今回までに学んだことは以下の通りです。
・斜めっている写真の角度を直す
・写真の左右を反転する
・色の調整をする
・ブラシや鉛筆でなにか描く
僕が持っている参考書のChapter4までを終えました。
もっとさくさくやらなければ、と思っていたのですが、
Chapter5のページをめくったところ、
「レイヤーについて」という見出しを発見してしまいやる気を失いました。
レイヤーという言葉がこわいです。
レイヤーについてまだなにも知らないけど、
レイヤーという言葉のせいでphotoshopに対して、
敷居の高さを感じてる自分を発見しました。
レイヤーこわい。
◆斜めな画像をまっすぐにする
カンバスの回転というところを選んで角度を変えてもいいのですが、
「ものさしツール」を使って傾斜角度を測り、数値を入力するほうが簡単きれいでした。
地味に感動しました。
【ものさし修正前画像】

【ものさし修正後画像】

次の画像に今回学んだことを凝縮してみました。
【凝縮画像】

★ポイント
・前回までに学んだ選択範囲を使い塗り潰しをした!
・選択範囲は当分の間練習しないとコツを忘れてしまうと思った!
・ctrl+oで新規ファイルを開くショートカットは使いまくり!
・対象物をalt押しながらドラッグすると複製できる!
・ブラシツールがすごそうだという可能性を理解した!
最後に、ちょいとテクニック的なものをやろうと思って作ってみた画像を晒して終わりにしたいと思います。
テーマは「写真に動きを出す」です。
【えび修正前画像】

【えび修正後画像】

★ポイント
・レイヤーを複製して対象物を「ぼかし」でぼかした!
・「指先ツール」を使って対象物とぼかしたレイヤーとの間の違和感をなくしてみた!
えびを海に帰してみました。
跳ねてます。
うーむ、やはりレイヤーの理解はまだまだだなあ。
次回までには
・レイヤーについて
・文字とシェイプ機能について
・web機能概要について
を学んでおきたいと思います。
とりあえずレイヤー!

ワイヤーとローカルの開発環境で早くも混沌

2007/09/19 水曜日 - 17:57:32 by kazuhide

水曜日の原田で御座います。
今回はワイヤーフレームとデザインイメージまで思い切って詰めちゃいます。一般的にはどういうステップでするのかは知りませんが自分のやりやすい感じで。
■ワイヤーフレームを考える
ワイヤーフレームとか言っておきながら、ワイヤーフレームのことがイマイチよくわかっていませんでした。
単に線で機能をレイアウトするもんだと思っていましたが色々奥深いようです。
例:
∵【レポート】ハイクオリティサイトのワイヤーフレーム分析 (1) 他サイトのワイヤーフレームから学べること | クリエイティブ | マイコミジャーナル
∵画面レイアウトを考える その3ホームのワイヤーフレームを作る:ITpro
まぁ、でもまずはざっくりと作ってみようかと。そこでいつもどおりに何か参考になるサイトを。
そこでこちらを選びました。
∵wis.dm
これはいわゆるQ&Aサイトですが、最近、ぼつぼつ目にする。
シュリンプミーの構造とも近いところがあるような気がするので(勘)、これを参考にさせて頂く。
所要時間:5分
■ワイヤーフレームを作る
作り方もよくわかってませんが見よう見まねで作成。
むしろパワーポイントの要領で作成。まずはミニマムな構成を検討。
で、この場合、機能なども考える必要があるかと思いましたが、まずはミニマムで行こうということで、トップページとクイズページの2枚の構成。
・トップページ

・クイズの投稿部分

所要時間:20分
■デザイン
デザインは後の話かも知れませんが、とりあえず色を決めたいということで暖色(主にオレンジ)で作成しようと決めました。
理由はエビがオレンジだからです。
所要時間:5分
■開発環境を整える
ローカルに環境を整えなあかんということでXAMPP。
∵XAMPP
XAMPPに関しては以下などご参考;
∵XAMPP - 開発環境一括インストール - phpspot
「前にインストールしたはず」と思って、アクセスするとパスワードを忘れログインできず。
しょうがないので再インストールをすると、ダウンロードするファイルを混同し事件(Zip版とインストーラー版)。そこから花金トラブルスパイラルに突入。
そして2時間ほど格闘するもThinkPad君が疲れたそうなので一次休止(調子が悪くなった)。
しょうがないのでまずはリモートでしたろかしらん。
所要時間:2時間半
ということで、次週は頑張ってPHPに早速入ってみます。あ、デザインつまらずに終わっちゃった。来週はHTMLとCSSでサイトの枠組みを先に作っちゃおうかしら。

切り替えてやって行こう

2007/09/19 水曜日 - 00:46:42 by sokenpico

どんもーっ☆そうけんびここと、びこたんです!
一週間ご無沙汰ですね!
この一週間の間にいろんなことがありました。
一番ショックだったことは
銀魂だと思ってた漫画がBLEACHっていう漫画だったっていうことです!!
ショック!だってどっちも和装でトゲトゲ頭じゃん!
私が好きなのは銀魂じゃなくてBLEACHでした!
ということで!他の皆がプログラミングを頑張っている中、アタシも頑張ってましたよ!
ずっと阪神応援してました☆
最近では中継ぎをやっている渡辺君ってのがちょーーーーーーーーーーーーーーーー=カッコE☆のでございます。
びこたんマジドツボ。ということで、100日のうち、残り93日となってしまったのですが、アタシもとりあえず絵をかかなければ始まらないだろうということで、とりあえず描いてみました。
題して、夏の思い出。

波の表現とか苦労しました。あと彼の裸体?>< 、書くの恥ずかしかったぁってことで。
本日windowsのペイントというものを使ったのですが、なかなか難しい!色塗ろうと思ったのですが、辞めました、思い出が汚れそうだったので。
このままだと読んでいる皆様に、何の知識もプラスされない駄文になってしまいそうなので、私が今日ハマった点を一つ。
IEの場合、tableにappendChildする時はtbodyを入れないと動作しないよ!
という点です。
var table = document.getElementsByTagName(”table”)[0];
var tr = document.createElement(”tr”);
var td = document.createElement(”td”);
td.appendChild(document.createTextNode(”びこたん”));
tr.appendChild(td);
table.appendChild(tr);
みたいので、firefoxは動くのだけど、IEはだめ。
var tbody = document.createElement(”tbody”);
ってして、ここにtrいれて、こいつをtableにappendすれば桶みたい。
まったく、だからIE嫌いなんだおー><。
ということでまたね!来週は色を塗ってみます。
ちなみにこれは今日試しに塗ってみた格闘漫画です!

なんてことをやってても上手くなるわけがないので、鉛筆からやり始めます。

とりあえず手から始めて見ました。無骨な手★、鉛筆が何故だが4Bしかなかったので、非常に線が太いですね。明日かってこよっと。
アタシは見たまま描くのが昔から下手(バランスが見れない)ので、そこのところ重点的に練習していきたいです。

クラスとPEARと私

2007/09/18 火曜日 - 00:57:25 by kensuu

こんばんは、月曜日担当のけんすうです。
PHPを勉強しています。
さて今週は結構すすんできました。
まずしたのが、ideamiの削除ツールの作成。
ideamiは、アイデアが投稿できて、
それにたいしてコメントがつけられるというものなのですが、
いかんせん、スパムが多い。
対策はしなければいけないんですが、
取り急ぎ、削除をしやすくする環境が欲しかったのです。
経過は以下の通り
削除管理ツール作成その1
削除管理ツール作成その2
削除ツールが完成
いやぁ、最低限ですが、とりあえず動くのがよかった。
勉強して思ったのが、とりあえず動くものを作る、というのがいかに大切かです。
たとえ大きめのアプリでも動くものを積み重ねて
作っていかないと、モチベーションが保たれません。
目に見える成果を作っていくのは、勉強していく上で非常に重要ではないかと。
特にぼくらのような、初心者にとっては
いかに動く楽しみに気づくかは、勉強を続ける上で
大きなファクターだと思いました。
さて、さらに今週は
オブジェクト指向とPEARについて学びたいと思い、勉強しました。
classを学ぶのだ
classを使ってみたよその1
classを使ってみたよその2
classを使ってみたよその3
classというものがPHPにはあるのですが
これが最初概念がよくわからず、かなり苦労しました。
今もわかっているかどうかはわかりませんが、
なんとか納得はしています。
100%理解していなくても先に進める、
これも勉強する上では効果的です。
そこでとまるよりもとりあえず手を動かしてみる。
あとから理解がついていくこともあるのです。
そして、PEAR。これはクラスがわかっていればなんとかなりました。
むしろセットで考えたほうが実践的かも。
以下みたいな感じで、データベースとの接続をしました。
<?
require_once("DB.php");

class Init_class{
public $db_object;
public $decode_key = "abcdefg";
public $db_user = "user";
public $db_pass = "password";
public $db_host = "localhost";
public $db_name = "dbname";
public $site_name = "ideami";

function __construct(){
$db_string = "mysql://" . $this->db_user .":" . $this->db_pass . "@" . $this->db_host . "/" . $this->db_name;
$this->db_object = DB::connect($db_string);
}
}

if(Init_class){
print ("db connected!");
}else{
print "error!";
}
?>
すっきり!汎用性が高そう!
こういうのはすごく楽しいですね。
さて、今週は、
・クラスでプログラムを読みやすくする
・PEARを使ってページングとかに挑戦
・しかもAJAXとかうまく使えないかな・・・
あたりをやってみたいと思います!