「5秒でわかる」を作る！ハイパーカジュアルゲームのデザイン - 意匠部

2023/07/13 130 users ハイパーカジュアルゲーム 越後 デザイン 5秒 テクニック

こんにちは！意匠部の越後です。 僕は今ハイパーカジュアルゲームという、超シンプルなゲームを作っています。 この記事では、超シンプルなゲームだからこそ必要な初めて見た人が遊びを理解するスピードを上げるためのテクニックを紹介できればと思います。 ハイパーカジュアルゲームってなに？ とはいえ今回は初回なの... 続きを読む

すき焼きの写真にすき焼きの3Dモデルを埋め込む方法 - KAYAC engineers' blog

2021/12/14 13 users KAYAC engineers すき焼き 3Dモデ Blog

この記事は Tech KAYAC Advent Calendar 2021の14日目の記事です。 こんにちは！意匠部のおばらです。 今日は、知っていても役に立たないかもしれない、 WEBページでの画像の変な使い方をご紹介しようと思います。 題して「すき焼きの写真にすき焼きの3Dモデルを埋め込む方法」です。 すき焼きの写真にすき焼きの3Dモデ... 続きを読む

Prott Blog - たった1ヶ月でProttはなくてはならないツールになった！ - 面白法人カヤック

2015/08/21 22 users Prott 割石 面白法人カヤック Prott Blog 越後

たった1ヶ月でProttはなくてはならないツールになった！ - 面白法人カヤックProttインタビュー Vol.5 Prottインタビュー Vol.5 面白法人カヤック 意匠部・人事部　佐藤　ねじ さん 意匠部・UI部・人事部　越後 壮平さん 意匠部　中森 源さん 意匠部・人事部　割石 裕太さん 「Prottを導入したい！」と上司に掛け合った ——カヤックさんが全社的にProttを導入してくださっ... 続きを読む

【トリビア】：資生堂の美意識が詰まった「資生堂書体」って知ってる？　100年近く手書きで社員に伝承してるらしいぜ！ - ねとらぼ

2014/04/03 200 users 書体 美学 トリビア 資生堂 資生堂書体

化粧品メーカーの資生堂が、同社が100年近く伝承している独自の書体「資生堂書体」を動画で紹介していました。同社の美意識が込められた書体であり、長年、同社のデザイナーが手書きで伝承しているらしいです。 資生堂書体は、1916年の意匠部（現在の宣伝・デザイン部）設立とともに「資生堂の美学と精神性を表現する」フォントとして誕生し、資生堂のポスターやパッケージを長らく彩ってきました。現在でも、同社に入社し... 続きを読む

デザインするための三種のリファレンス | KAYAC DESIGNER'S BLOG - デザインやマークアップの話

2012/06/20 71 users リファレンス KAYAC DESIGNER 新顔 ウィット

はじめまして。 まだカヤックでは新顔ですが、意匠部最年長！？の山下です。 「つくるための三種の神器」 というテーマということで、 僕の方からは、つくる（デザインする）ときにとても意識して参考にしているものを 三つのメディア別にご紹介したいと思います。 雑誌部門 archives 海外の広告を紹介する雑誌です ウィットの富んだ表現が豊富に紹介されています。 http://www.luerzersar... 続きを読む

どう考えても無茶な「CSSプログラミング」が話題に | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/06/22 973 users カヤック KAYAC DESIGNER Blog 無茶 話題

CSS3がいくらパワフルとはいえ、さすがにここまで凝ったものが作れるとは思いませんでした。 まずはChromeでこちらを遊んでみてください。 CSS3 OF THE DEAD - jsdo.it - share JavaScript, HTML5 and CSS まるでJSをバリバリ使ったゲーム、のように見えますが、実は「Only CSS」。上のSTOPボタンを押すとコードを確認することができます... 続きを読む

これからの主流？ jQuery Mobileに触ってみよう - ADC MEETUP ROUND01に登壇してきました | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/06/13 28 users カヤック KAYAC DESIGNER ネイティブアプリ

今回の主題は「モバイルを攻略せよ」 先週の土曜日（6/11）に、Adobeが主催する、ADC MEETUP ROUND01に登壇してきました。 主題は「モバイルを攻略せよ」ということで、DreamweaverやFlashなどを使って、スマートフォンアプリやサイトの制作についての話に焦点が当てられました。 今回自分が話した内容は、「ネイティブアプリに変わる、新しいアプリ開発スタイル」というタイトルで... 続きを読む

HTML+CSS主体のJavaScriptエフェクト！ 簡単で「使える」jQueryテクニック（解説つき） | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/05/31 633 users カヤック KAYAC DESIGNER Blog ハロこん

4月から入社した2011年度新卒社員です。 ハロこんにゃんセヨ がぜんウェブウェブしているほんだです。 今年4月より、意匠部のME課（めか）でマークアップエンジニアとして働いているほんだです。 入社したての新卒社員ですが、PCサイトのHTML+CSSのマークアップや、MovableType（ブログ構築ツール）での組み込みなど、色々な仕事をさせてもらってマークアップリア充です。 そんな中でも最近多い... 続きを読む

もしもフロントエンジニアがSVG女子をイジったら。音声認識やfpsコントローラなど凄すぎる件 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/05/13 54 users カヤック KAYAC DESIGNER イジ パスワード 視聴

SVG女子が公開されて2週間がたちました たいへん多くの方に視聴していただいているようで、感激しています！ 「SVG」がすっかりバズワードになっていますね。 まだの方はぜひご覧ください！ SVG女子を見る SVG女子にはユーザーが自由にイジってオリジナル作品を作れるモードがあります。 いわゆる「神モード」というやつです。 この「神モード」に公開直後から多くの作品が集まっています。（嬉しい！） SV... 続きを読む

AndroidゲームデザインWORDDICT!の試行錯誤 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/05/09 34 users カヤック KAYAC DESIGNER 試行錯誤 Blog

最近スマートフォンをメインにデザインをしているshiihoです。 今までWEBのキャンペーンサイトやFlashサイトを担当していて Androidのデザインは初めての体験でしたので、その試行錯誤をまとめたいと思います。 今回デザインを担当したのは英単語をつくるパズルゲームWORDDICT! 画面に次々と出現するアルファベットから英単語を見つけていくゲームです。 悪役のバグバグの侵略を阻止しながら高... 続きを読む

SVG女子を90%軽くしたSVG軽量化テク+α #svggirl | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/04/25 240 users SVGアニメーション ラスベガス あいつ アニメーション 必見

あいつ仕事してないで女の子のイラストばっかりいじってるぞと陰ながら言われていた喜納です。 HTML5で動くSVGアニメーション「SVG女子」がラスベガスでのマイクロソフト基調講演MIX11で公開され、 世界を（いろんな意味で）驚かしてきましたが、 ついに本日、日本でも公開されました！ しかも日本版に合わせてアニメーションも長くなっています！ こっそりブラウザを英語にして見ていた人も必見です！ （神... 続きを読む

2011年はSVG元年に。デザイナー大注目の画像フォーマット「SVG」の特徴を一気におさらい。 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/04/21 138 users SVG カヤック KAYAC DESIGNER おさらい 疑問

MIX11で「SVG女子」が紹介されました！ 弊社が制作をさせていただいた「SVG女子」が先日ローンチし、MIX11で大きく取り上げられました。 こちらがその様子です。 日本上陸は4/26！「SVG女子」をより楽しむために、まずはSVGについて知っておきましょう。 それでは続きからどうぞ！ SVGの気になる疑問に答えます！ SVGって何？ SVG（Scalable Vector Graphics）... 続きを読む

Web制作業界最速？！CS10の新機能を使い倒してみた！ #aprilfool | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/03/31 45 users Photoshop 待望 電脳メガネ カヤック 前回

もう使ってる？CS10！さてさて！先日発売されました、待望のCS10。デザイナーなら誰しもが使っているであろう、Photoshop。 その最新版の新機能をご紹介したいと思います！電脳メガネｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!CS10の最大の特徴ともいえば電脳メガネ！前回のCS9から、拡張スクリーン対応になったのですが、 CS10からはなんと拡張スクリーンメガネ付きで販売されています！ なかなかおしゃ... 続きを読む

東北地方太平洋沖地震に対し、デザイナーができること | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/03/13 56 users カヤック KAYAC DESIGNER Blog デザイナー

東北地方太平洋沖地震にて、募金や各種支援活動がありますが、デザイナーでも出来ることをまとめてみました。※こちらの情報は随時更新していく予定です。デザイナーでもできる活動がありましたら @barimi 、面白法人カヤック意匠部Facebookページ、もしくはこちらの投稿フォームにご連絡ください。どうぞよろしくお願い致します。#ideaforlife東北地方太平洋沖地震のため、命のためにできるアイデア... 続きを読む

第0回 HTML5プログラミング＆クリエイティブ コンテストに作品を応募しました | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/03/10 12 users カヤック KAYAC DESIGNER 比留間 コンテスト

HTML5の可能性を示すコンテストども、久々に投稿になります。ME課の比留間です。 さて、先日開催された「第0回 HTML5プログラミング＆クリエイティブ コンテスト」に作品を応募してみました。結論から先に言ってしまうと、残念ながら賞をいただくことはできませんでした。 しかし、先日開催されたデブサミ2011のブースで、HTML5関連として自分の作品を展示していただくことができました。（コンテストの... 続きを読む

初めての企画書が、最終選考に残った　アイデアの出し方 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/03/02 740 users カヤック KAYAC DESIGNER Blog アイデア

販促会議賞という企画コンペに出させていただき、ファイナリストに残ることが出来ました！ 本職デザイナーが、どうやって考えて企画を立てたか。思考の足跡をつらつらと書きます。ちなみに出した企画はこちら。まずは販促会議賞ってなに？という人にご説明。販促会議賞は、いろんな企業から「この商品の販促アイデアを考えて下さい」という感じでお題が出され そのどれかに応募するというものです。 企画をパワーポイントにA4... 続きを読む

【重くても】インタラクティブなPV集（世界編）【気にしない】 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/02/28 43 users カヤック KAYAC DESIGNER PV集 Blog

海外の最近のインタラクティブなPVって？2011年ってもっと未来かと思ってたよ...(　´･‿･｀)こんにちわ。セキネです。 突然ですが、インタラクティブって良いですよね。 つまりユーザーが見て、触って、はじめて真価を発揮するようなコンテンツ達です。 そして昨今は、ミュージックビデオのプロモーションにもそんなインタラクションが組み込まれるようにもなってきました。（日本では去年の暮れにバズった「映し... 続きを読む

ユーザーを逃さない！海外Webアプリの入力フォームいろいろ | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/02/25 139 users カヤック KAYAC DESIGNER Blog ユーザー

このフォームのポイント！上部のボックスでエラー表示入力時にリアルタイムのエラー判定それぞれのフォーム下部にエラー文言項目名を赤く目立たせる 続きを読む

iPhoneデザインで役立ったツールまとめ | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/02/24 107 users カヤック KAYAC DESIGNER iPhone 遷移

未だにiPhoneデザイン中の解像度と実機に表示される大きさに慣れないshiihoです。 今回はiPhoneのデザインで自分なりに約にたったツールをまとめてみようと思います。 それでは早速見てみましょうマインドマップで遷移図を整理iPhoneアプリは通常のWEBページに比べて状態の変化や遷移が複雑な場合があります。 マインドマップで整理してみると上記画像のように分かりやすくなりました。 ソフトによ... 続きを読む

地獄のミサワがCSS3の勉強に最適と話題に | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2011/02/15 397 users ミサワ カヤック KAYAC DESIGNER canvas

CSS3に興味はあるけど、きっかけが無いなあと思っている方へこんにちわ、jsdo.it担当のふちがみです。最近jsdo.itで地獄のミサワをイジりながらCSS3やcanvas、javascriptを学ぶ動きが活発なんです。「それ2年ぐらい前に見たわー」という方も続きからどうぞ！一瞬でわかるまとめフロントエンジニアたちが地獄のミサワに夢中 - togettercanvasで描かれたミサワ 続きを読む

今年ありがとうを言いたい「html5の本」5+1選 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2010/12/21 311 users カヤック KAYAC DESIGNER 一つ一つ Blog

連載企画「今年ありがとうを言いたい○○」 2010年も残り僅かとなりましたが、いかがお過ごしでしょうか。 デザイナーズブログでは今年を振り返って、 それぞれが「ありがとうを言いたいもの」を紹介する連載企画をはじめます。 第一弾は「今年ありがとうと言いたい『html5の本』」です。 それでは続きからどうぞ！ 徹底解説HTML5マークアップガイドブック タグが一つ一つ解説されています。 html5を勉... 続きを読む

HTML5でつまずきやすいasideとsectionの使い方 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2010/12/20 514 users section 縁起物 aside コーディング 久保田

HTML5分かりにくいですよね。 初めまして。11月からME課で働いている久保田(@ta2_o2p)です。よろしくお願いします！ 自分の仕事としては、携帯サイト中心にコーディングを行っているのですが、BMKidsの縁起物と笑い袋の紹介ページのコーディングを行ったり、他にも色々とPCサイトのコーディングをしています。 さて、実はカヤックで働き始めてHTML5を本格的に触ったのですが、触れていくうちに... 続きを読む

大量の画像をサクサク処理するためのエントリまとめ | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2010/12/01 397 users カヤック KAYAC DESIGNER Facebook

大量の画像を書き出す場面に遭遇して( ꒪⌓꒪)ってなるのはWEB屋の宿命のようなものですが そんな書き出しを一瞬でもはやくやっつけたい。 むしろやりたくない。なにもかも機械に任せたい。 機械がやってくれてる間にはとサブレ食いながら優雅にFaceBookをたしなみたい。 そんなめんどくさ効率を追求するために調べたまとめです。 なにかお役に立つものがみつかればうれしいです。 書き出しをとにかく速くした... 続きを読む

いま読むべき、クリエイティブWEBマガジン10選 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2010/11/24 800 users カヤック KAYAC DESIGNER Blog デザイン

カッティングエッジなカルチャーをピックアップする、クリエイティブWEBマガジンをセレクト。 いますぐキャッチアップして、クリエイティブシーンのニューウェイヴをサーフしよう！ Public-image.org Public-imageは、ANSWR代表の針谷氏によって創められたWebマガジン。 ひとつひとつの記事に、執筆者名が記載されており、 単なるインフォメーションでなく、ひとつの視点によるエディ... 続きを読む

ログイン画面の離脱率を下げる！ECサイト各社の工夫 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話

2010/11/19 384 users カヤック KAYAC DESIGNER nonaka 離脱率

こたつにみかんはじめました。nonakaです。 週に１度は通販で買い物してます。そんな中、ログインする画面をいろいろ見たので、ファッション通販サイトのログイン画面を集めました！ ファッション通販サイトの場合、ログイン画面に「新規会員登録」への誘導があるのがほとんどです。今回は、2つのパターンにわけてご紹介します。 「ログイン画面」エリア、「新規登録」エリアが上下にあるパターン セレクトショップ：B... 続きを読む