23人のカヤック社員がおすすめする「つくるときに役立つ三種の神器」まとめ | KAYAC DESIGNER'S BLOG - デザインやマークアップの話
7月7日に行われる面白法人カヤックのイベントである「777☆カヤックフェスティバル」に向けて、 6月6日〜7月6日までの間、 ディレクター、エンジニア、フロントエンジニア、デザイナー、 全職能のブログを、同じテーマの記事でつなぐ「777ブログウェイ」を実施していました。 23人のカヤック社員が、「つくるための3種の神器」をテーマにブログを書きました。 そのまとめ記事になります。 デザイナーまとめ 新しいPCに入れる基本ソフト3つ：Windows版 新卒Webデザイナーが考える「五月病」を脱却する方法 Workflow para reducir el tamaño de tus assets デザインするための三種のリファレンス グラフィッカーの三種の神器！？ 思わず絵が描きたくなる（！？）三種の神器 ディレクターまとめ もっと知りたい！「好奇心」をつくる３つの視点とサービスを紹介します
縦や横に長いサイト「高級ペライチ」1度は見ておきたいスクロール演出のまとめ32個！
HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」！ HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します！ まずは王道！縦に長い高級ペライチ
CSSだけで必殺技を作るコンテストのクオリティーが高すぎる件
jsdo.itで「SPEC」というコーディングコンテストを開催しています。 今回のテーマは以下の二つ。 CSSだけを使って必殺技の演出を加えてください ローディングの演出を考えてください 「こんなマニアックなテーマだけど参加してくれる人がいるのだろうか…！」と心配していたのも杞憂に終わり、続々とすごい作品が投稿されています。 開催期間中ですが、ぼくが個人的に「これは！」と思った作品をピックアップして紹介したいと思います。（コンテストの審査とは関係ないですよ！） CSSだけを使って必殺技の演出を加えてください スーファミのRPG風 えい！：forked: CSSで必殺技！ - jsdo.it - share JavaScript, HTML5 and CSS 光が集まる必殺技 forked: CSSで必殺技！第2弾！ - jsdo.it - share JavaScript, HTML5 a
知らないと人生損してる！デザイナーのための必見ブログまとめ
はてブたくさんついちゃいました(・∀・) お久しぶりの意匠子です。 先日のHTML５に関する記事がとんでもないブクマ数ついちゃいました。 今の世の中はHTML5旋風吹き荒れてますね！ このような最新情報を集めるのもデザイナーの大事なお仕事！ そこで今回は知らないと人生を損しているであろうデザイナー必見のサイトをまとめました！ 続きをどうぞ！ まずは鉄板サイトから！！ Webクリエイターボックス チュートリアル系の記事が豊富。 まぁWebデザイナーはほぼ100%見てるいると思って間違いなし。 コリス Webデザイナーやマークアップエンジニアで、 このサイトを知らないのはモグリと思われてしまうくらい有名なサイト。 CSS3やJavaScriptの話題が豊富。ちなみに某りすこさんとは関係ありません。 ホームページを作る人のネタ帳 Webデザインを学ぶ人はみんな一度は見たことがあるぐらい有名なネタ
いまさら聞けない＞＜； 基礎から学ぶ「HTML5」超入門！
HTML5 旋風、吹き荒れてますね！(^0^)／ さて、ものすごく突然で恐縮ですが、この度「HTMLファイ部」、設立しました！ 株式会社カヤック（本社：神奈川県鎌倉市、 代表取締役CEO：柳澤大輔、http://www.kayac.com以下「カヤック」）は、HTML＋CSSコーディング、JavaScript プログラムを担当する職種が所属する「HTMLファイ部」を発足いたします。 これまでHTMLおよびCSS、JavaScriptの担当者は、プログラマが所属する技術部、デザイナが所属する意匠部ME課（MEはMarkup Engineerの略）に分かれて所属していましたが、昨今のHTML5の進化と普及を受けて、HTML、CSS、JavaScriptの担当者は「HTMLファイ部」にて活動をスタートします。 そんなHTMLファイ部員が今回お送りさせていただくのは、 HTML5 について基礎から
2011年はSVG元年に。デザイナー大注目の画像フォーマット「SVG」の特徴を一気におさらい。
MIX11で「SVG女子」が紹介されました！ 弊社が制作をさせていただいた「SVG女子」が先日ローンチし、MIX11で大きく取り上げられました。 こちらがその様子です。 日本上陸は4/26！「SVG女子」をより楽しむために、まずはSVGについて知っておきましょう。 それでは続きからどうぞ！ SVGの気になる疑問に答えます！ SVGって何？ SVG（Scalable Vector Graphics）は、XMLによって記述されたベクターグラフィック言語のこと、あるいは、SVGで記述された画像フォーマットのこと。W3Cでオープン標準として勧告されている。 Scalable Vector Graphics - Wikipedia 簡単に言うと、ブラウザで表示できるベクター画像のフォーマットです。 SVGって何がすごいの？どういうところが便利なの？ ベクターデータなので拡大しても荒れません。 例えば
今熱い！無料オーディオ系サービスのUI 7選＋α
昨日、2010年12月1日、ついに IPサイマルラジオ「radiko」がついに本格サービススタート！ ワッショイワッショーイ！ てなこともあり、無料音声配信コンテンツが今最高にアツイ！と信じて疑わないgunjiです。 映像系サービスが大人気の今、なぜあえて音声だけがイイのか？ それを語り始めると夜が明けてしまうので、今回はあまり掘り下げませんが ひとつは、コンテンツを配信する方・視聴する方 両方にとってハードルが低く、 別のことをしながら利用出来るということが挙げられると思います。 まあムービー見ながら仕事するのはけっこう難しいし、ふつうに怒られちゃうけど 作業用BGMなら仕事の効率がアップすることもありますしね。 移動中も眠りながらも聞いていられますしね。 というわけで今回は国内外の、特にプレイヤー部分のUIが面白い 無料オーディオ系サービスをご紹介したいと思います。 「ながら利用」を加
いま読むべき、クリエイティブWEBマガジン10選
カッティングエッジなカルチャーをピックアップする、クリエイティブWEBマガジンをセレクト。 いますぐキャッチアップして、クリエイティブシーンのニューウェイヴをサーフしよう！ Public-image.org Public-imageは、ANSWR代表の針谷氏によって創められたWebマガジン。 ひとつひとつの記事に、執筆者名が記載されており、 単なるインフォメーションでなく、ひとつの視点によるエディットされた情報が堪能できる。 その独自視点によるコラムは脳汁モノ。 現在は、オルタナティヴスペース「Public-image3D」など、オンラインメディアを飛び出して、 メディアと現場をクリエイティブスクラッチした実験を日々発信中！だそうです。 2次元メディアにとどまらないその心意気にクラップハンズ。 Public-image3D: http://3d.public-image.org 以下サイト
購買意欲を刺激する！印象的なHTMLメルマガ10選
マラソンに夢中！ nonakaです。 毎週通販サイトのhtmlメルマガを作っているので、他の通販サイトのメルマガも多数購読してます。 今回は、通販サイトのhtmlメルマガを集めてみました。 通販サイト html形式メルマガまとめ セレクトショップ：BEYES（バイズ） 【メルマガの横幅】600px。 【構成】バイヤーからの一押しアイテム、毎週更新される特集ページバナー、新商品情報、ファッションコラムなど。その他、購入者限定のメルマガも配信してます！ 靴下専門店：Tabio（タビオ） 【メルマガの横幅】713px。 実際のメルマガ用のhtml 【構成】雑誌掲載商品、季節のリコメンド、ランキングなど要素が豊富！ 無印良品 【メルマガの横幅】569px。 実際のメルマガ用のhtml 【構成】バナーが縦に並ぶ構成が多い。 facebookやtwitterの案内もさりげなくヘッダーに入っている。 z
Tシャツデザイナーになろう！そしてお小遣いまで稼ごう！
2000年代中盤のweb2.0登場以来、ユーザーが参加出来る・貢献出来るWEBサービスって本当に増えましたね。 その中で今回デザイナーが参加・貢献出来る、そしてお小遣い稼ぎまで出来ちゃう WEBサービスをいくつかピックアップしました。 とは言っても、デザイナーが何かを作って・売るというサイトは以外と多いので、 今回はTシャツのWEBサイトに絞りました。 Tシャツのデザインを自分で考えて、WEBサービスを通じて売るというシンプルなことですけど、 実は各WEBサイトではそれにオリジナリティを色々と加えています。 T-SELECT（http://t-select.livedoor.com/） Tシャツコミュニケーションサイト Tシャツのデザインを応募すると、一定期間にサイト上で掲載され、 期間内に受注が一定数集まれば販売出来るというシステム。 買う人が多いと値段が下がるという特徴もあります。 t
今日からCSS3アニメーションを使えるようになるチュートリアル
CSS3のアニメーションってスゴい！ 先日のぽんたくんの記事でも紹介されたように、CSS3ではアニメーションも制御できるようになりました。 ということで、ぼくもCSS3のアニメーションを使ってdemoをいくつか作ってみました。 SafariやChromeなどwebkitブラウザで表示してみてください。 コピペで使えるCSS3アニメーション - jsdo.it ※PLAYボタンをクリックすると表示されますよ 見れない人のために動画も撮ってみました。 どうですか？CSSだけで、まるでFlashを使ってるような表現ができちゃうんです。 今回はこのCSSのアニメーションのチュートリアルをご紹介します。 「NEW!」というアイコンが、1文字ごとにぴょこんぴょこん跳ねるアニメーションを作ってみましょう。 上記のdemoでいうと二つ目の動きです。 HTML <p class="animetionNew
CSS3だけでつくるWebボタン！押さずにはいられないボタン簡単3ステップ
インターンシップにきています。 こんにちわ。(・`д・ノ)ノ 面白法人カヤックでインターンシップ中のどうもぽんたです。 先週、鎌倉本社から自由が丘支社に移りました。 自由が丘に来たのは初めてなので、「丘ないなぁ。」って思いました。 そしてこちらはインターン研修で、書いているエントリーです。 どうか柔らかいまなざしで見守って下さいませ！ 今回は画像を使わず、CSS3だけでWebボタンをつくる方法を紹介したいと思います。 といっても僕自身つくったことがないので、一緒に挑戦しましょう！！ つづきからどうぞ！ すごいよ！CSS3 ≫ CSS3のみでつくっているボタンを紹介している凄いサイトがあります。 ラムネのようなテイストのボタンですな。 これを画像なしでつくってるっていうからスゴイ！ ここまでレベルの高いボタンはつくれないので、 基本重視のシンプルなCSSボタンをつくろうと思います。 まずはC
デザイナー必見！ポータルのポータル【モバイルデバイス編】
歴代人気記事でも上位の ポータルのポータル。 今回は、iPad・iPhone・携帯サイトなど モバイルデバイスのデザインギャラリーを集めてみました！ それでは続きからどうぞ。 iPad・iPhone Landing Pad ー an iPad App Gallery 綺麗なiPadアプリがたくさん掲載されています。 iOSpirations iPad/iPhoneのアプリやサイトデザインが紹介されています。 ishowcase 国内のiPhone / iPad最適化対応サイトが掲載されています。 iPhoneサイトデザイン集のiPhoneデザインアーカイブ 公式サイト 国内/海外のiPhoneサイトがたくさん掲載されています。 mobile AWESOMENESS 綺麗なモバイルデザインがたくさん。 Web Design Inspiration for the iPhone iPhoneに
あなたもマンガが描ける！〜写真加工でマンガ風〜 | Topics | DB - KAYAC Designer's Blog（カヤック デザイナーブログ）
マンガ読んでますか？ そうですか、読んでますか。 え！？ マンガが描きたい？ でも、絵が描けない、、そうですかぁ 大丈夫です！これからご紹介するテクニックを駆使すればマンガが描けますよ！！ それでは写真をphotoshopで加工してマンガ風の画像にする方法をご紹介します。 ※説明ではphotoshop cs4 mac版を使用しています。 適当な写真を用意 夏のひまわりを用意しました。 コントラストをはっきりさせる イメージ＞色調補正＞レベル補正 などで色をはっきりさせ、シャープも１回くらいかけてパッキリとした画像にします。 彩度を下げて白黒にする 自然な彩度や彩度を下げるを選択して白黒にします。 階調を減らす イメージ＞色調補正＞ポスタリゼーションで色の階調を4〜10あたりに設定します。 スクリントーンぽいレイヤーを重ねる 白と黒のドットパターンを用意して重ね合わせます。ドットレイヤーのレ
デザイナー必見 ポータルのポータル | Topics | DB - KAYAC Designer's Blog （カヤック デザイナーブログ）
こんにちはShiihoです。 ネットに広がる様々なデザインポータルサイト、これが一つの場所に集まったら、ものすごく便利ですよね。 ということで、作っちゃいました。ポータルサイトを集めたポータルです。 デザインの参考等に使用できるので、どんどん活用してください。 ブックマーク FICC Another Bookmark Beta 非常に多くのカテゴリーでブックマークされている。配信されているニュースも参考になる The FWA 多くのFlashサイトを集めたポータルサイト。制作会社も確認でる ikesai.com 企業別に分けられてたカテゴリーが非常に参考になる。 FLASH MANIA Flashコンテンツに特化したポータルサイト WEBデザイン・データベース 企業別のカテゴリー、ユーザーによるサイト評価がある あんじょうできてはる 国別にデザインをソートできるポータルサイト オールラウン
ドキッ！デザイナーのバッグの中身拝見！
皆様こんにちは！いつもはデザイナーたちのアウトプットを紹介していますが、今回は kayacデザイナー達のこだわりの身の回りアイテムを紹介していきたいと思います！ ...という名目で、抜き打ち荷物検査を行いました！！いったい何が出てくるのか！？ hashimotoの鞄の中 鞄はユニクロの真っ白なやつを使ってます。 ■CROQUIS 100sheets maruman ss クロッキー帳。メモ帳としても、落書き帳にもできる、程よい大きさが使いやすいです。ロゴマークが鼻から飛び出てる鼻毛に見えるので好きです。 ■ステッドラー トリプラス ペン。人間工学に基づいて設計された三角のグリップがにぎりやすいです。あところころ転がらないのでうれしい。描き味もよく線の強弱がつけやすいのでイラストを描くときに重宝しています。 ■GUM #211 かため 歯ブラシ。ボディの配色がいいです。 中でも取っ手が紫でブ
美女コンテンツをまとめてみた。 | Topics | DB - KAYAC Designer's Blog（カヤック デザイナーブログ）
こんにちは、shiihoです。突然ですが美女系コンテンツをまとめてみました。 勢いでやった。反省はしていない。 男の子なら分かりますよね、この気持ち・・・・ ということで早速、紹介していきましょう。 美女暦 王道中の王道、日替わりで様々な美女を紹介しています。 美人時計 美女が1分ごとに時間を知らせてくれます。iPhoneアプリも登場しています。 THE AXE EFFECT | AXE RESEARCH LAB 様々な美女が好きという言葉を連発します。もうノックアウトです。 今日の注目GIRL こちらも毎日美女を紹介しているサイト、ランキングとかもあって熱い！ トーキョー・メットガール ヘルメットをかぶった美人を見ることができるブログパーツが提供されています。 4U 美女の写真を共有しちゃうサイト。海外の美女も見れてgood シンブンテイメント 一時期、各地の新聞とコラボして話題になりま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
