先日、面接に際して架空のコスメバナーを作りました。 春の新製品を想定して、華やかなイメージに。 ターゲットは10代〜20代前半の女性。 商品のグロス部分はフリー素材が見つからなかったので ペンタブで描きました。 写真はモデルピースさんからDL。
久しぶりの更新は新年のご挨拶になってしまいました。 昨年は、たくさんの方に大変お世話になりました。 本年もマイペースではありますが、目標に向かってがんばりたいと思いますので、 どうぞよろしくお願いします。実は先月から、Wordpressの既存テーマを…
HAPPY HALLOWEEN 今朝、急遽思い立ちハロウィン用の画像を作り始めました。 その後外出したので、31日も終わりに近いですが完成。 フォントはこちらFONT MANIAのフリーフォントを使用しました。 （Windowsだと、この配色は目に痛いかな…）
10月24日、無事支援訓練を修了することができました。 振り返ると、3月にこの講座を受講するかどうか逡巡し、やる前から理由を作って動かないのはよくないと、意を決して申し込んだことを思い出します。その時の判断は本当に正しかったと、今、自信を持って…
サイトのプレゼン 本来ならポートフォリオサイトのプレゼンをするところですが、枠組みしかできていないので もう一つ作っていたサイトのプレゼンをしました。 てくてく みなとみらい http://puisto.moo.jp/minatomirai/ 横浜みなとみらい周辺のおすすめ散歩…
今日来て下さったのは、製作会社に務めているNさん。 以下お話のメモ。 仕事 最初のデザインは1日〜2日で作る（psdから書き出し） スピードは何に対しても要求される CSSで大事なのはIE6対策、スマートフォン対策 よく使われるツール Photoshop,Fireworks レ…
SEO （1）「検索システムの種類」について述べた次の文章のうち、 適切でない ものはどれか、選びなさい。a.「ディレクトリ型」とは、集められたWebサイトの情報を人の手によっ てカテゴリ分けする検索システムである。 b.Yahoo!のカテゴリ検索は「ディレク…
WordPressのプラグイン Share buttons by lockerz / Add to any ソーシャルボタンの設置 WPtouch スマフォサイトに最適化してくれる Contact Form 7 お問い合わせページの設置 Simple RSS feeds widget 複数RSSを取得できる RSS import 投稿内や固定ページに…
固定レイアウト レイアウトの設定 前回のM,Sサイズは%指定。 今回はpx指定。 Lサイズ：横幅960px Mサイズ：横幅620px Sサイズ：横幅300px http://puisto.moo.jp/kadai/0911/index.html index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width"> <title>固定レイアウト</title> </meta></meta></head></html>
可変レイアウト 実際のサイト↓ http://puisto.moo.jp/kadai/0910/sample.html sample.html <html lang="ja"> <head> <meta charset="utf-8"> <title>メディアクエリ</title> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="style-l.css"> </link></meta></meta></head></html>
GPS機能とTwitterの連携「東京スカイツリー」の緯度経度 なんとなく気が引けて、tweet部分はぼかしてます。 実物は、こちらで geo.js (function($) { /* 設定 */ var geo = { twitter: "http://search.twitter.com/search.json", lat: 35.710058, // 緯度 ln…
Static Maps API <html> <head> <meta charset="utf-8"> <title>Google Map Test</title> </head> <body> <a href="http://maps.google.com/maps/api/staticmap?center=35.724943,139.719913&zoom=16&size=500x500&maptype=roadmap&sensor=false">マップで見る</a> </body> </html> Maps JavaScript API
リンクシェアの新着情報一覧を取得する rss.php channel->item; ?> <html> <head> <meta charset="UTF-8"> <title>リンクシェアサイトの新着情報 RSS表示</title> </head> <body> <p>リンクシェアサイトの新着情報一覧</p> </body></html>
HeartRails Capture http://capture.heartrails.com/ WebページやPDFファイルのサムネイル画像を作成できるサービス。 Google Chart Tools https://developers.google.com/chart/infographics/?hl=ja QRコードを生成する <img src="http://chart.apis.google.com/chart?chs=120x120&cht=qr&chco=0000cd&chl=http://d.hatena.ne.jp/puisto/" alt=""> vintonくんの記事…
ナビを作る練習 上: お手本 下: 自作 今回はFireworksのみで作成しました。 Photoshopと違い、破線を簡単に作れるのが楽しいです。 ナビを使わせていただいたサイト: E・レシピ
Fireworksの互換 Illustratorの場合 Illustratorからコピペするとレイヤーが保持されない ファイル→読み込む にするとレイヤーが保持される 保存形式を変える場合 ファイルを書き出し→FXG形式 Illustratorできれいに読み込める Photoshopの場合 ファイル→読…
Fireworks-ボタン制作 角丸 角丸長方形使わない→数値が出ないから 端が丸まっているものは角丸の半径100%指定 px指定は角丸が少しの場合 フィルター フィルター→Photoshopライブ効果 プレビューしながら調整できる シンボル化 シンボルに変換するとドキュメ…
Fireworks 基本 変更→カンバス→画像サイズ (Psの画像解像度に相当) エッジはアンチエイリアスかけておく 100%に見えるものが限界 多角形で上に角が来る図形にする場合、shiftを押しながら上に持ち上げる テキストとして見せる場合は、アンチエイリアスなし "…
Webとは関係ない記事です。 ニール・アームストロング氏というと、この曲を連想。 シナトラ版もすきです。
授業めも アクセス制限 robots.txt テキストファイルで下記のようなrobots.txtを作る User-Agent: * Disallow: /フォルダ名/ アスタリスクは全ての検索エンジンに対して、という意味 フォルダを1つ作って、その中に見せたくないフォルダを入れる robots.txt…
CSSでフォームをデザイン <html> <head> <meta charset="UTF-8"> <title>フォームをデザイン</title> <link rel="stylesheet" href="style.css" media="print, screen"> <script> function focusColor(i) { i.style.borderColor='#7f9db9'; i.style.backgroundColor='#ffffff'; } function blurColor(i) { i.style.borderColor…</link></meta></head></html>
外部ブログのRSSを取得し表示する <html> <head> <meta charset="utf-8"> <title>RSSを取得</title> </head> <body> <ul> item as $item) { if(++$i>5)break; $dc = $item->children('http://purl.org…</ul></body></html>
お問い合わせ入力フォーム2 サンクスページを作成 お問い合わせ入力フォーム3 サンクスページにデータを受け取っていることを明示する お問い合わせ入力フォーム4 メールを自動送信する 稼動をチェックする↓ http://puisto.moo.jp/form/index.php index.php <html lang="ja"></html>…
お問い合わせ入力フォーム1 何も入力しなかった場合 全て入力した場合 index.php <html lang="ja"> <head> <meta charset="UTF-8"> <title>お問い合わせフォーム</title> <link rel="stylesheet" href="style.css" media="screen, print"> </head> <body> <form action="check.php" method="post" id="inquiry"> </form></body></html>
IllustratorでPPGのイラストをトレースする お手本 トレースしたものあまりペンツールを使わず図形ツールメインで再現しようとしたら、とても時間がかかりました。 基本的には線と塗りを一緒にしていますが、塗りは塗り、線は線で作ったほうが良かったかもし…
iPhoneサイト2 URL: http://puisto.moo.jp/iphone/02/ index.html <html lang="ja"> <head> <meta charset="UTF-8"> <title>エモトカホリ</title> <meta name="viewport" content="width=device-width"> <meta name="format-detection" content="telephone=no"> </meta></meta></meta></head></html>
iPhoneサイト1 URL: http://puisto.moo.jp/iphone/01/index.html index.html <html lang="ja"> <head> <meta charset="UTF-8"> <title>コウベデュカ</title> <meta name="viewport" content="width=device-width"> <meta name="format-detection" content="telephone=no"> </meta></meta></meta></head></html>
繰り返し処理-偶数の合計 <html> <head> <meta charset="UTF-8"> <title>繰り返し-偶数の計算</title> <style> h1 { font-size: 20px; } </style> <script> function goukei() { var ans =0; var bunbo =2; var a; for (i=1; i<=10; i++) { a = 1/bunbo; ans = ans + a; bunbo = bunbo*2;//次の計算用に分母の値を(2のn+1乗)にする } </meta></head></html>…
CSSでポップアップ画像を表示 実物はこちら <html lang="ja"> <head> <meta charset="UTF-8"> <title>CSSでポップアップ画像を表示</title> </meta></head></html>
バナー作成 世界のチーズキッチン お手本 作ったもの久しぶりにIllustratorと格闘しました。 Photoshopは写真の補正にのみ使用。 ただ、慣れや効率を考えると、切手風写真は無理にIllustratorで作らなくても良かったもかもしれません...。 ストライプの左右…
