年賀状印刷

郵便局の中にオープン!激安年賀状印刷
郵便局の印刷工房ポスタルスクウェアの年賀状印刷

安くてきれいでこんなに親切。
早期割引20%OFF!!松葉ガニ、松坂牛が当たる!

ライフグラフ[beta]

あなたの人生表示します。
お名前:

powerd by NEXTWISE

PR

正式サービス昇格!

実験サービス

  • Webマガジン funride MapNavi!
    自転車雑誌funride(ファンライド)の記事がネットで動く!
  • 筆まめonlineグリーティング(β)
    筆まめonlineのグリーティングメールサービス
  • 期間限定!ソーシャルデザイン実験室α版(無事終了!)
    みんなで作って、みんなで使う、新世代コンテンツサービス。たくさんのご協力ありがとうございました!

ダウンロード(Free!)

クレオ関連ブログ

« 2007年04月 | メイン | 2007年09月 »

2007年08月 アーカイブ

2007年08月31日

クチコミ情報を表示する「クチコミクリップ」

事務局コダマです。

株式会社カレンの始めたクチコミクリップなかなか面白そうです。

kizasiサーチエンジンを使って、ユーザーの口コミを収集し、最終的に人間が取捨選択する事で量と質のバランスがとれた口コミリンク集を作れます。
ブログパーツやガジェットなどのアドオン需要もありそう。

ビジネスの面では、自動車や家電などの耐久消費財や病院・健康食品あたりの広告に向いてそうです。
あとは、メーカーが(ある程度)コントロールできる口コミサイトという点をユーザーがどう評価するか、ですね。

2007年08月30日

雲型吹き出しの作り方

事務局コダマです。

エクセルやパワーポイントでプレゼン資料を作る時、イラスト素材の吹き出し(ふきだし)を使う事がありますよね。
Microsoft Officeのクリップアートやオートシェイプを使うといかにも、という感じですので、たまに自分オリジナルの吹き出しを作ってみたりします。

(例)Microsoft Excel(Power Pointでも同様)で作る雲型吹き出し

1.適当な大きさの円を吹き出しの形に並べます。

2.吹き出しの中央部分を消すために、円を置きます

3.中央に置いた円の線の色を、”なし”または”白”にしてできあがり

完全に自己満足の世界ですが、仕事の息抜きにもなるので、皆さんも試してみてはいかがでしょうか?
また、面白い自作素材などあったら、ぜひ、教えてください。

無料素材をお探しですか?筆まめonline

2007年08月27日

MovableType4とWYSIWYG

事務局コダマです。

MovableType4が出荷されて3週間ほど経ちました。

eCREOLABは、駆け込みでMT3を購入して8/5に立ち上げたので、ほぼMT3最後発のサイトになっています。
時期的に微妙なのはわかっていたのですが、安定度を取った形になりますね。

MT3で不満(というほどでもないですが)なのは、エディット機能がプアな点。
ブラウザのテキストコントロールそのままの編集画面に、B I Uなどの今となってはレトロなボタン群…
普段タグ補完型のエディタを使っていると、タグ入力もちょっと面倒。
MT4ではかなりリッチなエディタを搭載しているようなので、機会を見て導入検討してみたいものです。

MTでメインサイトを構築している企業をよく見かけますが、編集はどうしているんでしょうね。

2007年08月24日

FACE Conference Future更新

事務局コダマです。

FACE Conference Futureを更新しました。

■修正点
個別作成会議室で会議室を作った時に、会議室名に日本語を使用していると、会議室名が表示されない

CYO2さま、ご報告ありがとうございました。

2007年08月21日

メールのフッターから住所や氏名を抜き出す正規表現

事務局のコダマです。

正規表現を検索していて、大変面白いものを見つけました。
メールの署名から個人情報を抜き出すJavaScript

メールのフッターから、住所、氏名、電話番号などを自動的に抜き出すJavaScriptです。
事前にフッターだけをコピー&ペーストさせるため余計な情報が含まれず、かなりの精度で切り出せました。

メーラーごとのデフォルトフッターなんかを登録しておくと、さらに精度が上がりそうですね。
筆まめの顧客管理やプロアトラスのGIS機能と連携させると面白そうです。

2007年08月17日

mapmag.jp更新

事務局コダマです。

mapmag.jpの、月刊funride、ALPSLABとのコラボ企画「funride Map Navi!」のコーナーを更新しました。
funrideの発売日(8月20日)までは、funride Map Navi!でお楽しみください!

関連リンク
自転車雑誌 月刊funride
ALPSLAB

FACE Conference Future公開

事務局コダマです。

インターネット会議システム「FACE Conference Future β版 トライアル」を公開しました。
手軽で便利なインターネット会議を無料でお使いいただけます。(Webカメラ等は別途ご用意ください)

FACE Conference Future β版 トライアル

動作環境:Windows XP/2000 IE6.0
※Windows Vista IE7.0については動作確認中です。

会議室は2種類用意しました。

オープン会議室では、誰でも進行中のTV会議に参加することができます。
各社のラボメンバーとの会議なんかに使ってみたいですね。

プライベート会議室は、パスワードで制限されたメンバーだけが参加可能です。
支社間の打ち合わせなどに便利ではないでしょうか。

使ってみた感想など、ご自由にコメントまたはトラックバックでお知らせください。

08/20 名称を「FACE Conferenceシリーズ β版 トライアル」から「FACE Conference Future」に変更しました

ソーシャルデザインアップローダー更新

コダマです。

ソーシャルデザイン実験室で公開しているソーシャルデザインアップローダーを更新しました。

■変更点
カテゴリの横に、投稿されているファイルの数を表示

どのカテゴリが人気あるのかがわかってちょっと便利かと思うのですが、いかがでしょうか?

2007年08月16日

MovableType:ブログでソースコードを表示するのに便利なサイト

事務局コダマです。

サイトにPHPやHTMLのソースコードを掲載する場合、一般的にはpreとcodeタグを使うことが多いと思います。が、MTでpreタグを使うと、なぜか1行ごとに空行が挿入されてしまうんですよね。


<pre>
こんな風に
行間が空いてしまう
</pre>

しょうがないんでcodeタグだけ使っていますが、そうすると今度はインデントした分を&nsp;に置き換えないといけなくていちいち面倒ですよね。
なんかいい方法がないかと探していたら、PHP SPOTというサイトでPHPコード変換機というサービスを見つけました。

このサービスを使うとインデントの部分や<>を自動的に置き換えてくれてなかなか優秀です。
おまけにPHPコードの部分を色付けしてくれるので、見栄えもグー。
昨日掲載したソースを変換してみると、変換例のように色付けしてくれます。

こんな風にちょっとした問題を解決してくれるサービスっていいですね。
勉強になりました。

■変換例

<div class="whats-new-content">
    <h3 class="whats-new-header">What's New</h3>
    <div class="whats-new-body">
        <?php
            define
("oneday","86400");  // 1日の秒数
            
$today = time();           // 今日の日付
        
?>
        <MTEntries category="What'sNew" lastn="3">
        <p><$MTEntryDate format="%Y/%m/%d"$> <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>
            <?php
                
// 更新から1週間以内なら日付をwhats-new-new-dateにする
                
$entrydate = strtotime('<$MTEntryDate format="%Y/%m/%d"$>');
                if(
$today - $entrydate < oneday * 7 )
                {
                    print
' <span class ="whats-new-new-date"> recent!</span>';
                }
            
?>
            <br /><$MTEntryExcerpt$><br /></p>
        </MTEntries>
        others...<br />
        <div class="whtats-new-other">
            <MTEntries category="What'sNew"  offset="3" lastn="7">
                <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>
            </MTEntries>
        </div>
    </div>
</div>


2007年08月15日

MovableType:PHPによるWhat'sNewの自動化

事務局コダマです。

What'sNewの自動化で紹介したものをPHPを使って改良してみました。

改良点は
1.最新10エントリーをWhat'sNewに表示
2.うち最新3件を日付付きで表示
3.更新日が1週間以内のものは”recent!”を追加
4.4〜10件目は日付なし&小さめのフォントで一覧表示
です。

■実行例



■ソース
<div class="whats-new-content">
  <h3 class="whats-new-header">What's New</h3>
  <div class="whats-new-body">

    <?php
        define("oneday","86400");  // 1日の秒数 
        $today = time(); // 今日の日付
    ?>

    <MTEntries category="What'sNew" lastn="3">
      <p>
        <$MTEntryDate format="%Y/%m/%d"$> <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>

        <?php
          // 更新から1週間以内なら日付をwhats-new-new-dateにする
          $entrydate = strtotime('<$MTEntryDate format="%Y/%m/%d"$>');
          if( $today - $entrydate < oneday * 7 )
          {
             print ' <span class ="whats-new-new-date"> recent!</span>';
          }
        ?>

        <br /><$MTEntryExcerpt><br />
       </p>
    </MTEntries>
    others...<br />
    <div class="whtats-new-other">
       <MTEntries category="What'sNew"  offset="3" lastn="7">
           <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a> 
       </MTEntries>
    </div>
  </div>
</div>

■解説
細かくはソースを見ていただくとして、大雑把な動きは

1.$entrydate = strtotime('<$MTEntryDate format="%Y/%m/%d"$>');でエントリー日をUNIXタイムスタンプに変換
2.もし$entrydateと今日の日付の差が7日未満の場合、文字色を赤に
※スタイルシートでwhats-new-new-dateをcolor:redに設定しておいてください

です。
MTとPHPを組み合わせると便利ですねー。

2007年08月14日

MovableType:What'sNewの自動化

事務局コダマです。

”What'sNew”を追加しました。
せっかくのMovableTypeなので、MTタグで自動化しています。

MTEntriesタグを使うと特定カテゴリの抽出ができるので、それを使って”What'sNew”カテゴリのエントリーだけを一覧表示するようにしました。
こういう機能があるとCMSって感じがしますね!

■実行例



■ソース
  <div class="whats-new-content">
    <h3 class="whats-new-header">What's New</h3>
    <div class="whats-new-body">
      <MTEntries category="What'sNew" lastn="3">
        <$MTEntryDate format="%Y/%m/%d"$> <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a><br />
        <$MTEntryExcerpt$><br />
      </MTEntries>
    </div>
  </div>
(”whats-new-content”などは、ブログのデザインに合わせて適当に設定してください)

■解説
<MTEntries category="What'sNew" lastn="3">で、カテゴリが”What'New”のエントリーを新しいものから3つリストアップしています。
MTEntryDate format:エントリーの投稿日
MTEntryPermalink:エントリーへのリンク
MTEntryTitle:エントリーのタイトル
MTEntryExcerpt:エントリーの抜粋(なければエントリーの先頭から20ワード)
になります。

MTEntriesはいろんな制御ができるので、興味のある方はMT3.3のマニュアルをどうぞ。

2007年08月13日

MovableType:PHPによるモジュール化

事務局コダマです。

PHPによるモジュール化では、コードを埋め込むテンプレートファイルをPHPに対応させる必要があります。

eCREOLABではインデックス・テンプレートのメインページとアーカイブページ、アーカイブ・テンプレートのエントリページ、カテゴリーページ、日付ページをPHP化しました。

アーカイブページの変更を例にとると次の手順になります。
1.MT管理画面の「環境設定」にある「テンプレート」をクリック
2.「アーカイブページ」をクリック
4.出力ファイル名の拡張子を php に変更(archives.html → archives.php)
5.インクルードしたい部分にPHPコードを記述
<div id="banner">
<div id="banner-inner" class="pkg">
<-- ブログのホームページと同じディレクトリにあるbanner.htmlを読み込む -->
<?php require_once('<$MTBlogSitePath$>banner.html'); ?>

すべてのページの修正が終わったら、サイトの再構築を実行すれば完了です。

MovableType:バナーやサイドバーのモジュール化

MovableType(MT)に限らず、サイトを作っていると、サイドバーやフッターなど、いろんなページで共通化(モジュール化)したいところが出てきます。

eCREOLABではMTinclude、SSI、PHPの3つの方法でバナーやサイドバーなどをモジュール化を検討しました。

1.MTInclude(MTタグ)
例:<$MTInclude module="banner.html"$>
  
2.SSI(サーバーサイドインクルード)
例:<!--#include file="banner.html"-->

3.PHP(プログラム言語)
例:<?php require_once('banner.html');?>


1はサイト再構築時に共通部分を読み込むので、構築時間がかかってしまう反面、静的にHTMLを吐き出すので実行時(閲覧時)に読者を待たせる事がありません。
2と3はその逆で、実行時に読み込む分再構築が劇的に短縮できるかわりに、ページ表示時にオーバーヘッドがかかってしまいます。

今回は将来的にエントリーが増える事や機能拡張のしやすさを考えて、PHPを使ってモジュール化を行いました。

MTをPHP化する場合、いくつか設定変更が必要になります。
設定の方法は、次のページで。

2007年08月10日

ソーシャルデザイン実験室:投稿データについて

事務局の児玉です。

ソーシャルデザイン実験室の投稿について補足です。

ソーシャルデザイン実験室は、公開テストを目的とした開発途中のサービスであり、日々サービス内容が更新されています。
サーバーのメンテナンスやその他の理由により、お客様の投稿したデータを予告なく削除する事があります。

この点をご理解いただき、楽しくご利用ください。

ソーシャルデザイン実験室:投稿ありがとうございます

事務局の児玉です。


ソーシャルデザイン投稿コンテンツ

ソーシャルデザイン実験室への早速の投稿ありがとうございます。

投稿時のルールを確認させていただきます。

ソーシャルデザイン実験室は、みんなでイラストやデザインを共有するサービスです。
自分が投稿したものを公開すると、全ユーザーが参照できる状態になります。
他の人に見られたくない・使われたくないデザインなどは「非公開」のままにしておきましょう。

また、著作権に問題があるものや、他の人が不快に思うコンテンツは投稿しないようにしてください。
問題のあるコンテンツは、クレオが定期的に実施しているコンテンツパトロールで発見されしだい、非公開設定に変更させていただきますのでご了承ください。

また、メンテナンスや正式サービス移行に伴い、投稿データを削除する事があります。
大事なデータは、投稿前にバックアップをお取りください。

詳細は、利用規約をご覧ください。
それでは、今後ともよろしくお願い申し上げます。

2007年08月09日

ソーシャルデザイン実験室α版公開

社内で使っていた、筆まめonlineのデザイン制作ツールを外部公開しました。
もともと社内ツールなので、UIが洗練されていないのはご容赦ください。

ソーシャルデザイン実験室には2つのサービスがあります。

■ソーシャルデザイン アップローダー
ソーシャルデザイン アップローダーは、クリエーター向けのサービスです。
写真やイラストを公開し、筆まめonline用のデザインテンプレートを作ることができます。

■筆まめonline ソーシャルデザイン版
筆まめonline ソーシャルデザイン版は、ソーシャルデザイン専用の筆まめonlineです。
エンドユーザー向けのサービスです。
※筆まめonline ベータ版(app.fudemame.net)のデザインを使うことはできません。

ソーシャルデザイン アップローダーで公開されたデザインテンプレートを選んで、ポストカードや送付状などを作ることができます。

例えば、写真フレーム付きのポストカードを作る場合、

1.ソーシャルデザイン アップローダーで写真フレームイラストをアップロード
2.ソーシャルデザイン アップローダーで写真フレームを使った、ポストカードのテンプレートを作成
−− ここまでがクリエーターの作業
3.筆まめonline ソーシャルデザイン版で、2のテンプレートを選び、自分の写真をはめ込み
4.オリジナルポストカードの出来上がり!

となります。

ソーシャルデザイン アップローダーでは、デザインのマッシュアップが可能です。
他の人が作ったポストカードなどのデザインテンプレートを再編集して、新しいデザインテンプレートとして投稿可能!

それでは、利用規約をお読みのうえ、マナーを守ってお楽しみください。

ソーシャルデザイン実験室
http://lab.creo.co.jp/webmame/

2007年08月06日

MovableType:タグクラウド(タグ一覧)コーディング例

ブログ勉強中のコダマです。
人気のタグ
eCREOLABのサイトを普通のwebサイトからMovableTypeに移植しているんですが、MovableType以前に、スタイルシートの初心者なので覚える事がいっぱいあって大変です。
で、どうせ勉強するなら、という事でサイトの更新をしつつ、進み具合を報告していきたいと思います。

今日はタグクラウドを追加してみました。
Flickrやニコニコ動画なんかで使われているアレです。

■MTでのタグクラウドの作り方
MovableTypeはエントリー・タグのランキングを管理するMTTagsがあるので、それを使うと簡単に追加でます。

■タグクラウドのソース
<div class="module-tagcloud module">
    <h2 class="module-header">人気タグ</h2>
    <div class="module-content">
        <ul class="module-list">
            <MTTags>
                <li class="module-list-item taglevel<$MTTagRank$>">
                <a href="<$MTTagSearchLink$>"><$MTTagName$>  </a>
                </li>
            </MTTags>
        </ul>
    </div>
</div>

■スタイルシート
.module-tagcloud .module-content {text-align: left;}
.module-tagcloud .module-content .module-list { list-style: none;}
.module-tagcloud .module-content .module-list .module-list-item { display: inline; }
.module-tagcloud .module-content .module-list li.taglevel1 { font-size: 21px; }
.module-tagcloud .module-content .module-list li.taglevel2 { font-size: 18px; }
.module-tagcloud .module-content .module-list li.taglevel3 { font-size: 15px; }
.module-tagcloud .module-content .module-list li.taglevel4 { font-size: 13px; }
.module-tagcloud .module-content .module-list li.taglevel5 { font-size: 11px; }
.module-tagcloud .module-content .module-list li.taglevel6 { font-size: 10px; }

初期値では6段階のランクを持てるようになっています。
ランクの数は MTTagRank max="10" とすると、10段階に変更できるようです。

筆まめonlineベータ版公開

筆まめonlineベータテスト実施中です。
テストのお題ごとに、優秀な活動をされたモニターの方をMVP表彰しています。
ささやかながらプレゼントも用意していますので、みなさんぜひご参加ください。

http://lab.creo.co.jp/blog/online/

2007年08月05日

eCREOLABについて

eCREOLABは、私たち株式会社クレオが取り組んでいる新製品や新サービスを紹介するための実験サイトです。

私たちはパソコンが生まれた時からコンシューマ向けの製品に取り組み、「筆まめ」に代表される人気製品を送り出してきました。80年代初期に組み立て式マイコンキットで始めたコンシューマ向け製品の研究・開発から続く、新しいモノへチャレンジする精神を、私たちは大切にしていきたいと考えています。

私たちはeCREOLABという場を使い、開発中の製品・サービスをβバージョンの段階で皆様にいち早く体験していただき、ユーザーの皆様と一緒によりよい製品・サービスを作っていきます。

eCREOLABで公開中の製品・サービスに興味を持たれた皆様やクレオと新しい事に取り組んでみたいと考えている皆様、是非、ご連絡ください。私たちクレオは、世の中をもっと便利に、もっと楽しくする仲間を募集しています。

株式会社クレオ eCREOLAB事務局 (担当:児玉)
fudemame-online@creo.co.jp

利用規約

「CREOLAB」(以下「本サービス」といいます)は、次に掲げる「CREOLAB 利用規約」(以下「本規約」といいます)の規定に基づき、株式会社クレオ(以下「弊社」といいます)が運営するサービスです。お客様が本サービスを利用されるときは、事前に必ず「本規約」をお読みください。本規約に同意された方のみ、本サービスをご利用いただけます。

■サービス
第1条:「本サービス」とは、弊社が運営する情報提供、アプリケーションサービス及びダウンロードサービスをいいます。
2. 本サービスは日本国内においてのみ利用することができます。
3. 本サービスのご利用にあたり、次の各号に掲げる行為を禁止します。
I. 違法な行為を勧誘又は助長する行為
II. 本サービスの運営を妨害する行為
III. 第三者の名誉、信用、プライバシー権その他の権利を侵害する行為
IV. 暴力、性、差別、スパムその他一般の方が不快に感ずる行為
V. 選挙運動又はこれに類似する行為
VI. 弊社及び弊社の業務委託先に不利益となる行為
VII. お客様自身の身分を偽わるために使用する行為
4. 本サービスのご利用にあたり、お客様は宣伝、広告、販売その他の商業行為又はこれに類似する行為を行ってはならないものとします。但し、弊社の事前の書面による承諾あるときは、この限りではないものとします。
5. 本サービスではユーザサポートを行いません。
6. 弊社は、本サービスの内容を予告なく変更することができるものとします。

■著作権
第2条:お客様は、本サービスにより使用することができるイラスト、写真、デザイン及びフォント等(以下「コンテンツ」といいます)の複写及び複製をしてはならないものとします。
2. コンテンツの著作権は、弊社又は弊社に対する許諾者に帰属していることをお客様は確認するものとします。
3. お客様は、コンテンツを個人において私的にのみ利用することができるものとします。ただし、次の各号に掲げる行為は、行ってはならないものとします。
  I. コンテンツそのもの又はコンテンツを使用した作成物により代価を受け取る行為
  II. ロゴ、マーク、商標権、意匠権その他の法的権利が発生するものを作成するために使用する行為。
  III. 公序良俗に反して使用する行為
  IV. 弊社又は弊社に対する許諾者に対して不利益になる行為

■責任
第3条:本サービスのご使用に起因してお客様が被る損害に関して、直接的なもの又は間接的なものを問わず、弊社はいかなる責任も負わないものとします。
個人情報
第4条:本サービスでは、個人情報の取り扱いについて、弊社が定める個人情報保護方針を遵守し、管理及び運営するものとします。
2. 本サービスでは、お客様の個人情報を収集させていただく場合、随時、収集目的、お客様に対する弊社の窓口又は弊社がお客様の個人情報を提供する会社の範囲等を通知したうえで、必要な範囲の個人情報を収集させていただくものとします。
3. 弊社は、お客様の同意を得た場合に限り、お客様の個人情報を第三者に開示することができるものとします。但し、次の各号のいずれかに該当するときは、お客様の同意を得ることなく、弊社は必要な措置を講じることができるものとします。
  I. お客様が第三者に不利益を及ぼすと弊社が判断したとき。
  II. 裁判所、検察庁、警察、弁護士会、消費者センター又はこれらに準じた権限を有する機関から、弊社が利用者の個人情報の開示を求められたとき。
  III. 個人を識別することができず、又は特定することができないよう加工したものを作成することを条件に、個人情報の属性の集計又は分析を行い、弊社によるサービス開発又は提供等のために利用又は処理するとき。
4. 弊社は、業務委託先が委託業務を遂行するために必要な範囲内で、業務委託先に個人情報を開示及び預託することができるものとします。
5. 弊社は、弊社が保有するお客様の個人情報に関して適用される法令その他の規範を遵守するとともに、本条の規定を適宜見直し、改善するよう努めるものとします。
6. 個人情報の取り扱いに関するお問い合わせ先は次に掲げるとおりとします。
CREOLAB事務局 fudemame-online@creo.co.jp

■メンバー登録
第5条:本サービス及び本サービスからリンクされているオンラインショッピング及びオンラインダウンロードサービス等(以下、「外部サービス」といいます)をお客様が利用するときは、弊社はお客様にメンバー登録の実施を求めることができるものとします。お客様が本サービスにメンバー登録をしたときは、そのID及びパスワードはお客様の自己責任で管理するものとします。
2. お客様のID又はパスワードが第三者に漏洩したときは、お客様は遅滞なく本サービス窓口に連絡するものとします。
3. 弊社はID又はパスワードの漏洩、不正使用などに関して生じた損害について、いかなる責任も負わないものとします。
4. 弊社は本サービスにメンバー登録されたお客様に、製品・サービス等の案内を送付できるものとします。

■外部サービス
第6条:外部サービスには、他社が運営しているものも含まれるものとします。お客様が外部サービスを利用されるときは、当該外部サービスの規約をお守りいただくものとします。
2. 外部サービスのご使用に起因してお客様が被った損害については、直接的なもの又は間接的なものを問わず、弊社はいかなる責任も負わないものとします。
規約

■規約
第7条:弊社は、本規約を予告なく変更することができるものとします。
2. 本規約が変更された場合も、本サービス利用時に事前に本規約の内容に同意いただいたものとさせていただきます。