http://springreen.jp/INDEX/ 春翠工房-Webアプリ・スマホアプリ講座を開催中！ Sat, 19 May 2012 04:36:17 +0900 http://backend.userland.com/rss/ D3BLOG - XOOPS BLOG MODULE ブログ ja http://springreen.jp/INDEX/modules/d3blog/details.php?bid=443 5/10。平日は人集まらないと思った木曜日。 四名のご参加がありました。場所は新宿文化センター。 ソースを書くのはハードですが、いい雰囲気で５時間のセミナーを進められました。 参加のみなさま、ありがとうございました。 ぜひまたご参加ください。 Fri, 11 May 2012 03:49:43 +0900 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=443 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=442  本日は、こいのぼりゲーム。 少々むずかいしいソースになってしまったので、悪戦苦闘。 それでもみなさん、こいのぼりを泳がせることに成功しました。 中学生とおとうさんのご参加もあり、とてもよい受講者さんでした。 とりあえず、5月５日になったのでこいのぼりゲーム - jsdo.it - share JavaScript, HTML5 and CSS Fri, 04 May 2012 23:30:00 +0900 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=442 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=441 新宿エルタワーでの #HTML5 講座。きょうもとてもポジティブな皆さんにご参加いただけました。 いつものとおり、HTML5〜CSS3〜JavaScript〜canvas 最後は、某キャラクタににた画像の描画。皆さん悪戦苦闘のすえ、なんとか完成したようです。 ぜひ次のcanvas講座もお受けください。 Mon, 30 Apr 2012 23:51:06 +0900 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=441 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=440  水道橋での「Webショップ管理科」が無事、終了。 受講者の皆様、本当にお疲れ様。 「ネットショップ実務士」資格取得のための授業からはじまり、HTML、CSS、画像編集、ソーシャルメディア。 あ〜phpとMySQLもやりました。 ３ヶ月間、内容はてんこ盛りだったのに、 あっという間でした。 HTML5での描画授業も行いましたね。 ドラえもんのような？？画像の制作が一番盛り上がったのは 意外でした。（HTML5、やはりあなどれません） 明日は修了日。これからがスタートライン。 がんばってください。     HTML5でできたドラえもんのようなもの HTML5対応のブラウザで御覧ください。 var canvas = document.getElementById("dora"); var c = canvas.getContext("2d"); var frame=1; function en(x,y,r,color){ c.fillStyle=color; c.beginPath(); c.arc(x,y,r,0,2*Math.PI,true); c.fill(); } function strokeEn(x,y,r,color,color2){ c.strokeStyle=color; c.fillStyle=color2; c.beginPath(); c.arc(x,y,r,0,2*Math.PI,true); c.lineWidth=1; c.fill(); c.stroke(); } function hako(x,y,w,h,color){ c.fillStyle=color; c.fillRect(x,y,w,h); } function sen(x,y,x1,y1,color){ c.beginPath(); c.moveTo(x,y); c.lineTo(x1,y1); c.lineWidth=1; c.strokeStyle=color; c.stroke(); } setInterval(anime,50); function anime(){ frame++; //背景 c.fillStyle="black"; c.fillRect(0,0,600,600); //頭 en(300,170,150,"skyblue"); en(300,210,120,"white"); //胴体 hako(200,300,200,220,"skyblue"); //左腕 c.beginPath(); c.moveTo(200,300); c.lineTo(130,350); c.lineTo(130,430); c.lineTo(200,380); c.closePath(); c.fill(); //右腕 c.beginPath(); c.moveTo(400,300); c.lineTo(470,350); c.lineTo(470,430); c.lineTo(400,380); c.closePath(); c.fill(); //手 en(460,380,50,"white"); en(140,380,50,"white"); //お腹 en(300,380,80,"white"); //首輪 hako(200,280,200,20,"brown"); en(200,290,10,"brown"); en(400,290,10,"brown"); //目 strokeEn(260,100,40,"gray","white"); strokeEn(340,100,40,"gray","white"); //目玉 en(265+10*Math.sin(frame/90*Math.PI),85,10,"black"); en(335+10*Math.sin(frame/90*Math.PI),85,10,"black"); //鼻 en(300,140,20,"red"); //口 sen(299,160,299,250,"black"); c.beginPath(); c.arc(300,160,90,1/4*Math.PI,3/4*Math.PI,false); c.strokeStyle="black"; c.stroke(); //ひげ sen(250,180,200,160,"black"); sen(250,190,200,190,"black"); sen(250,200,200,210,"black"); sen(350,180,400,160,"black"); sen(350,190,400,190,"black"); sen(350,200,400,210,"black"); //脚 hako(200,500,200,30,"white"); en(200,515,15,"white"); en(400,515,15,"white"); //また en(300,500,10,"black"); hako(290,500,20,80,"black"); en(285,515,15,"white"); en(315,515,15,"white"); //鈴 en(300,300,20,"yellow"); en(300,300,5,"black"); sen(300,300,299,320,"black"); //ポケット c.beginPath(); c.arc(300,380,70,0,Math.PI,false); c.closePath(); c.strokeStyle="black"; c.stroke(); } Fri, 27 Apr 2012 02:24:16 +0900 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=440 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=439  新宿エルタワーで、HTML5のcanvas講座を行いました。 題材は「ピンボールゲーム」。デザイン的には「ピン」と「ボール」と「打ち返し」なんですが、 計算式が意外と難しいWebアプリ。 今日の参加者は１１名。 山梨からおいでになったかたもいて、感謝です。 最後、得点競争をしました。最高得点優勝者には、豪華賞品をプレゼント。 ぜひご参加ください。 Sun, 22 Apr 2012 23:58:06 +0900 http://springreen.jp/INDEX/modules/d3blog/details.php?bid=439