<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/atom10japanesefull.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><feed xmlns="http://www.w3.org/2005/Atom">
    <title>Design</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/" />
    
    <id>tag:101lab.net,2007-08-17:/design//27</id>
    <updated>2007-11-11T09:40:18Z</updated>
    <subtitle>デザインの事など</subtitle>
    <generator uri="http://www.sixapart.com/movabletype/">Movable Type Publishing Platform 4.0</generator>

<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/atom+xml" href="http://feeds.feedburner.com/101lab/design" /><feedburner:info xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" uri="101lab/design" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><entry>
    <title>Flickr</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2007/11/flickr.html" />
    <id>tag:101lab.net,2007:/design//27.2104</id>

    <published>2007-11-11T09:40:18Z</published>
    <updated>2007-11-11T09:40:18Z</updated>

    <summary>This is a test post from , a fancy photo...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[This is a test post from <a href="http://www.flickr.com/r/testpost"><img alt="flickr" src="http://www.flickr.com/images/flickr_logo_blog.gif" width="41" height="18" border="0" align="absmiddle" /></a>, a fancy photo sharing thing.]]>
        
    </content>
</entry>

<entry>
    <title>#000 Step by Step</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2007/09/000-step-by-step.html" />
    <id>tag:101lab.net,2007:/design//27.2004</id>

    <published>2007-09-23T02:20:28Z</published>
    <updated>2007-09-28T14:25:46Z</updated>

    <summary>以前「Step by Step」という米国の雑誌がありまして、Illustrat...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
        <category term="Step by Step" scheme="http://www.sixapart.com/ns/types#category" />
    
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="mac" label="Mac" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="maclife" label="MACLIFE" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        以前「Step by Step」という米国の雑誌がありまして、IllustratorやPhotoshopのノウハウを公開していました。多くの影響をうけたものです。僕自身もMacintosh専門誌の「MACLIFE」などで同様の連載記事を書いたりもしていました。

この101LABが徐々に変わっている様を「Step by Step」でお伝え出来ると面白いなあと思います。

以前も同様の試みをしたのですが、途中で挫折しました。理由はサイト変更をいちいち報告するのが面倒だったからですね。システムの問題かな。今回はしっかりとサイト構築の履歴を付けていきたいと思います。
        
    </content>
</entry>

<entry>
    <title>サイトの内容の見直し</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2007/08/post.html" />
    <id>tag:101lab.net,2007:/design//27.1848</id>

    <published>2007-08-17T11:28:38Z</published>
    <updated>2007-09-16T11:49:42Z</updated>

    <summary>MovavleTypeをバージョン4に変更したついでに、サイトの内容とデザインを...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
        <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="api" label="API" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="blog" label="blog" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="digg" label="Digg" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="movabletype" label="MovableType" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="shopping" label="shopping" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        MovavleTypeをバージョン4に変更したついでに、サイトの内容とデザインを見直しすることに。立ち上げたもののまともに更新されていないブログばかりだったしね。というわけで、メモ書き。
        <![CDATA[<h2>既存ブログ</h2>

<strong>101Blog：</strong>現状どおり近況報告の内容。もっと気軽に書き込めるといいかな。カテゴリーは「マッキントッシュ」「インターネット」は別のブログに移管予定。

<strong>101WebDesign：</strong>もう完全にdel.cio.usのアーカイブになっちゃってるんで<fn>MT4にしてからは反映されてないみたいだけど</fn>、そのままにしておこう。新規のエントリーはDesignブログに移行。

<strong>101Memo：</strong>そんなのあったっけ。ははは。過去のアーカイブは残っているんだけれど、ネットのクリッピングは「<a title="101Tumblr." href="http://101.tumblr.com/" >101Tumblr.</a>」などを利用する。

<strong>101Photo：</strong>Flickerに移行。Flicker API利用できるようになったら復活しよう。

<strong>101MACLIFE：</strong>結局まともに更新できず。廃止。

<h2>新設ブログ</h2>

<strong>Design（仮称）：</strong>新設。WebDesignだけではなく話題を広げる。技術系のクリッピングはdel.cio.us経由の101WebDesignに。コードやサンプルなどはDev（仮称）、SEO系は別の所で。

<strong>Dev（仮称）：</strong>xhtml、css、JavaScriptコードのアーカイブ。主に開発系。

<strong>JavaScript（仮称）：</strong>JavaScriptライブラリのサンプル置き場。主にAjax系。

<strong>MacLifeHack：</strong>MacやLifeHackの話。お仕事ブログという位置づけ。Macだけ独立とも思っていたんだけれど、たぶんそんなに追いかけないしなあ。

<h2>予定</h2>
<strong>101Store（仮称）：</strong>オンラインストア。通常購入のシステムとアフィリエイトの組み合わせ。システム構築が目的。

<strong>101News（仮称）：</strong>アグリゲーターとDiggライクなシステムの組み合わせ。

<strong>101Map（仮称）：</strong>GoogleMapp APIを利用したマッシュアップ。
]]>
    </content>
</entry>

<entry>
    <title>PHPで画像サムネイルを作成する便利クラス</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/php-1.html" />
    <id>tag:101lab.net,2006:/design//27.1920</id>

    <published>2006-08-31T06:27:55Z</published>
    <updated>2007-08-30T08:40:13Z</updated>

    <summary>PHPで画像サムネイルを作成する便利クラス『PHP Thumbnailer』:p...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
        <category term="Code" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="image" label="image" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="reflection" label="reflection" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="thumbnail" label="thumbnail" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="PHPで画像サムネイルを作成する便利クラス『PHP Thumbnailer』:phpspot開発日誌" href="http://phpspot.org/blog/archives/2006/08/phpphp_thumbnai.html" >PHPで画像サムネイルを作成する便利クラス『PHP Thumbnailer』:phpspot開発日誌</a></div>
PHPで画像サムネイルを作成する便利クラス『PHP Thumbnailer』
</blockquote>]]>
        <![CDATA[<p>オリジナル：</p>
<p><img src="/images/Thumbnailer.jpg" /></p>

<p>絶対パス：</p>
<p><img src="/common/scripts/php4_thumbnail/show_image.php?filename=/home/dtf/101lab.net/public_html/images/Thumbnailer.jpg&width=250&height=250" /></p>

<p>リフレクション：</p>

<p>createReflection($percent,$reflection,$white,$border,$borderColor)</p>

<ul>
	<li>$percent - What percentage of the image to create the reflection from</li>
	<li>$reflection - What percentage of the image height should the reflection height be</li>
	<li>$white - How transparent (using white as the background) the reflection should be, as a percent</li>
	<li>$border - Whether a border should be drawn around the original image (default is true)</li>
	<li>$borderColor - The hex value of the color you would like your border to be (default is #a4a4a4)</li>
</ul>

<p><img src="/images/show_image.php?filename=Thumbnailer.jpg" /></p>

<textarea name="code" class="php" cols="60" rows="10">
include_once('thumbnail.inc.php');

$thumb = new Thumbnail($_GET['filename']);
$thumb->resize(150,150);
$thumb->cropFromCenter(150);
$thumb->createReflection(40,40,80,true,'#a4a4a4');
$thumb->show();
$thumb->destruct();
exit;
</textarea>
]]>
    </content>
</entry>

<entry>
    <title>Prototype.js を使って、MovableTypeで最新記事を表示する</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/prototypejs-movabletype.html" />
    <id>tag:101lab.net,2006:/design//27.1909</id>

    <published>2006-08-12T23:17:59Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>Prototype.js を使って、MovableTypeで最新記事を表示する：...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="Prototype.js を使って、MovableTypeで最新記事を表示する：Goodpic" href="http://www.goodpic.com/mt/archives2/2006/08/prototypejs_mov.html" >Prototype.js を使って、MovableTypeで最新記事を表示する：Goodpic</a></div>

以前に、MovableTypeの個別記事ページに最新記事を表示するjavascriptを書いたのだけれど、それを Prototype.js をちゃんと使うように書き直した。script.aculo.usのアニメーションを追加したり、色々と遊んでいると、複数のJavascriptを混在して読み込むようになってき気持ちが悪いので。

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>prototype.js v1.4.0 の使い方</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/prototypejs-v140.html" />
    <id>tag:101lab.net,2006:/design//27.1908</id>

    <published>2006-08-12T23:16:35Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>prototype.js v1.4.0 の使い方 prototype.js は ...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="prototype.js v1.4.0 の使い方" href="http://www.imgsrc.co.jp/~kuriyama/prototype/prototype.js.html#Reference.Extensions.DOM" >prototype.js v1.4.0 の使い方</a></div>

prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。
				この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。
			
			
もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。
私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。
自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>PHPでPDFファイルを作成するFPDFの進化版『TCPDF』</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/phppdffpdftcpdf.html" />
    <id>tag:101lab.net,2006:/design//27.1907</id>

    <published>2006-08-11T02:49:44Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>PHPでPDFファイルを作成するFPDFの進化版『TCPDF』:phpspot開...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="PHPでPDFファイルを作成するFPDFの進化版『TCPDF』:phpspot開発日誌" href="http://phpspot.org/blog/archives/2006/08/phppdffpdftcpdf.html" >PHPでPDFファイルを作成するFPDFの進化版『TCPDF』:phpspot開発日誌</a></div>

PHPでPDFファイルを作成するFPDFの進化版『TCPDF』

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>RSSフィードをページに簡単に貼り付けられるツール</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/rss.html" />
    <id>tag:101lab.net,2006:/design//27.1906</id>

    <published>2006-08-10T22:57:54Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>URLを入力するだけでRSSフィードをページに簡単に貼り付けられるツール:php...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="URLを入力するだけでRSSフィードをページに簡単に貼り付けられるツール:phpspot開発日誌" href="http://phpspot.org/blog/archives/2006/08/urlrss.html" >URLを入力するだけでRSSフィードをページに簡単に貼り付けられるツール:phpspot開発日誌</a></div>

URLを入力するだけでRSSフィードをページに簡単に貼り付けられるツール

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>Dynamic Drive CSS Library</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/dynamic-drive-css-library.html" />
    <id>tag:101lab.net,2006:/design//27.1905</id>

    <published>2006-08-10T19:44:10Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>Dynamic Drive CSS Library- Practical CSS...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="Dynamic Drive CSS Library- Practical CSS codes and examples" href="http://www.dynamicdrive.com/style/" >Dynamic Drive CSS Library- Practical CSS codes and examples</a></div>

Dynamic Drive CSS Library
Welcome to Dynamic Drive's new CSS library! Here you'll find original, practical CSS codes and examples such as CSS menus to give your site a visual boast.

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>CSSによる階層メニュー</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/css.html" />
    <id>tag:101lab.net,2006:/design//27.1904</id>

    <published>2006-08-10T19:36:25Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>Dynamic Drive CSS Library- SuckerTree Me...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="Dynamic Drive CSS Library- SuckerTree Menu (v)" href="http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/#" >Dynamic Drive CSS Library- SuckerTree Menu (v)</a></div>

This is a vertical, predominantly CSS based (with a touch of JavaScript) multi-level menu. It supports as many sub levels as you desire, plus multiple Suckertree menus on the same page. The CSS and JavaScript automatically adopts to your HTML code in each case.

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>クラウドソーシング</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/post-9.html" />
    <id>tag:101lab.net,2006:/design//27.1903</id>

    <published>2006-08-10T19:32:34Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>【コラム】クリエイターのためのライフハック 第9回 みんなの力を借りて何か作って...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="【コラム】クリエイターのためのライフハック 第9回 みんなの力を借りて何か作ってみない? - Cambrian House (MYCOMジャーナル)" href="http://journal.mycom.co.jp/column/lifehack/009/" >【コラム】クリエイターのためのライフハック 第9回 みんなの力を借りて何か作ってみない? - Cambrian House (MYCOMジャーナル)</a></div>

クラウドソーシング(Crowdsourcing)という言葉を知っていますか? 2006年6月号のWired誌に登場したこの言葉。意味はアウトソーシングと少し似ていますが、ビジネスモデルとして全く新しい意味を持っていると考えられています。

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>PHP VIDEO TUTORIAL FOR WEB DESIGNERS</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/php-video-tutorial-for-web-des.html" />
    <id>tag:101lab.net,2006:/design//27.1902</id>

    <published>2006-08-09T14:55:44Z</published>
    <updated>2007-08-30T05:05:27Z</updated>

    <summary>PHP VIDEO TUTORIAL FOR WEB DESIGNERS KIL...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="PHP VIDEO TUTORIAL FOR WEB DESIGNERS" href="http://www.killerphp.com/?" >PHP VIDEO TUTORIAL FOR WEB DESIGNERS</a></div>

KILLER PHP - FOR WEB DESIGNERS
  This  is a  beginners website/course on PHP created for web designers who have little to no programming experience. 
  Where most other PHP tutorials and books   assume you know  programming (or at least, that's what it seems like ...) killerphp.com assumes you need to have things explained (and demonstrated) in non-nerd terms.

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>ＥＳＰを使ってＦｅｅdsとＲＳＳリーダーを代替する</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/ds.html" />
    <id>tag:101lab.net,2006:/design//27.1901</id>

    <published>2006-08-09T02:04:17Z</published>
    <updated>2007-08-30T05:05:26Z</updated>

    <summary>ＥＳＰを使ってＦｅｅdsとＲＳＳリーダーを代替する - ナレッジ！？情報共有・・...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="ＥＳＰを使ってＦｅｅdsとＲＳＳリーダーを代替する - ナレッジ！？情報共有・・・永遠の課題への挑戦 [ITmedia オルタナティブ・ブログ]" href="http://blogs.itmedia.co.jp/knowledge/2006/08/whatsnew_bee8.html" >ＥＳＰを使ってＦｅｅdsとＲＳＳリーダーを代替する - ナレッジ！？情報共有・・・永遠の課題への挑戦 [ITmedia オルタナティブ・ブログ]</a></div>

　しかし最近、私の後輩がこの新着情報の取得と表示をエンタープライズ・サーチ・プラットフォームを用いて実装するという非常に面白いアイデアを考え出しそして実際に実装を行った。以下に画面のサンプルを紹介するが、このポータル画面では、エンタープライズ・サーチ・プラットフォームの持つクローリング機能を用いて、社内の様々なシステムに散在するコンテンツのうち過去5日間に日付が更新されたもののみを取得しポータルに表示を行っている。

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>Bad Links</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/bad-links.html" />
    <id>tag:101lab.net,2006:/design//27.1900</id>

    <published>2006-08-09T00:24:42Z</published>
    <updated>2007-08-30T05:05:26Z</updated>

    <summary>CheckLinks | Plugins for Movable Type | ...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="CheckLinks | Plugins for Movable Type | staggernation.com" href="http://www.staggernation.com/mtplugins/CheckLinks/" >CheckLinks | Plugins for Movable Type | staggernation.com</a></div>

This Movable Type plugin implements a set of template tags for identifying invalid link URLs within entries.
If your site has been around for a while, a few or many of the pages you've linked to in the past may have ceased to exist or moved to new locations. Also, if you tend to link to a large number of pages, you might not be in the habit of clicking on each and every link to check it, so some URLs might not have been valid in the first place. The CheckLinks plugin tries to access all the URLs linked to in your entries (or a subset of your entries), and lets you display a list of the ones it can't successfully access.

</blockquote>]]>
        
    </content>
</entry>

<entry>
    <title>Columnize</title>
    <link rel="alternate" type="text/html" href="http://101lab.net/design/2006/08/columnize.html" />
    <id>tag:101lab.net,2006:/design//27.1899</id>

    <published>2006-08-09T00:17:22Z</published>
    <updated>2007-08-30T05:05:26Z</updated>

    <summary>Columnize | Plugins for Movable Type | s...</summary>
    <author>
        <name>101</name>
        <uri>http://101lab.net/blog/</uri>
    </author>
    
    
    <content type="html" xml:lang="ja" xml:base="http://101lab.net/design/">
        <![CDATA[<blockquote><div class="quotetitle"><a title="Columnize | Plugins for Movable Type | staggernation.com" href="http://www.staggernation.com/mtplugins/Columnize/" >Columnize | Plugins for Movable Type | staggernation.com</a></div>

This Movable Type plugin implements a set of template tags for displaying text in multiple columns. Your text will be broken up into approximately equal portions, and the HTML formatting you specify (i.e. a table cell) will be repeated once for each portion.

</blockquote>]]>
        
    </content>
</entry>

</feed>

