タグ

ブックマーク / techblog.kayac.com (47)

  • 【JS体操】第2問「画像の横長具合を比較しよう」〜正攻法&ハック部門の解説〜 - KAYAC engineers' blog

    こんにちは! カヤック面白プロデュース事業部のおばらです。 普段は受託案件のデザイン・フロントエンド開発などを担当しています。 さて、『JS体操』第2問 いかがでしたか? 今回初めての方々 第1問に引き続きの方々 複数のアプローチで何通りも回答してくださった方々 普段業務で JavaScript をバリバリ書いているであろう方々 JavaScript を学んでいる学生の方々 などたくさんの方々が挑戦してくださいました。 とても嬉しいです。ありがとうございます! 『JS体操』とは? 『JS体操』とはカヤックが主催する JavaScript のコードゴルフ大会です。 もともとは社内の勉強会として始めた施策です。 その詳細は以下のブログ記事を御覧ください! techblog.kayac.com 第2問の詳細はこちら https://hubspot.kayac.com/js-taiso-002 も

    【JS体操】第2問「画像の横長具合を比較しよう」〜正攻法&ハック部門の解説〜 - KAYAC engineers' blog
  • AWSコスト異常検知を導入したら、『人にお願いする』トイルが発生したのでSlackBotを作って解消した - KAYAC engineers' blog

    SREチームの池田(@mashiike)です。SRE連載の5月号になります。 AWSのコストについては、多くの方がすごく気にしていると思います。 カヤックでもAWSのコストの変動に関しては敏感に気にしています。 そんな方々の心のお供になる機能が、 AWSコスト異常検知(AWS Cost Anomaly Detection) です。 今回は、このコスト異常検知にまつわるトイル削減の取り組みを紹介します。 背景 AWSコスト異常検知は、AWS マネジメントコンソールの中では『Billing and Cost Management』配下にある機能になります。 この機能を使うことでAWSで発生したコストに関して、通常とは異なるコストの発生を検知することができます。 コスト異常検知自体については、CureApp テックブログ様のZennの記事がわかりやすくまとまっているので、そちらを参照いただければ

    AWSコスト異常検知を導入したら、『人にお願いする』トイルが発生したのでSlackBotを作って解消した - KAYAC engineers' blog
  • CloudFront FunctionsをテストするOSS、cfftを公開しました - KAYAC engineers' blog

    SREチームの藤原です。 今回は Amazon CloudFront Functions をテストするためのOSSとして、cfft というものを書いたので紹介します。 github.com 3行でまとめ CloudFront Functionsのテストは手元ではできなくて面倒です CloudFront Functionsをテストする cfft というOSSを書きました KeyValueStoreの操作を含め、便利な使い方がいろいろありますのでどうぞご利用下さい CloudFront Functionsをテストするのが面倒という問題 CloudFront Functions (以下CFF) は、AWSが提供するCDNであるAmazon CloudFrontのエッジノード上でリクエストやレスポンスの操作が行える、JavaScriptの実行環境です。典型的なユースケースとしては、キャッシュキーの

    CloudFront FunctionsをテストするOSS、cfftを公開しました - KAYAC engineers' blog
  • 【WebGL2】GPU Instancing x Transform Feedback で大量のインスタンスの計算と描画をGPUで行う - KAYAC engineers' blog

    ~ このエントリは 【カヤック】面白法人グループ Advent Calendar 2023 の22日目の記事です。~ こんにちは!ハイパーカジュアルゲームチームの深澤です。 WebGL2において GPU Instancing でメッシュを大量に表示しつつ、Transform Feedback を使ってインスタンスごとの情報計算もGPUに任せてみたいと思います。 ↓ デモはこちらになります。画像かURLから飛ぶことができます デモ: https://takumifukasawa.github.io/webgl-transform-feedback-gpu-instancing/ ↓ リポジトリのURL github.com メッシュ1つあたりの頂点数は24です。描画色は、インスタンスごとの色をふまえて平行光源の拡散光だけ計算しています。 GPU Instancing を使っていて、ドローコー

    【WebGL2】GPU Instancing x Transform Feedback で大量のインスタンスの計算と描画をGPUで行う - KAYAC engineers' blog
  • blenderを使って「自分の埴輪」を作る:藤井寺市 オリジナル3D埴輪メーカーの事例 - KAYAC engineers' blog

    こんにちは、OP事業部で主にUnityエンジニアをしている原です。 この記事はTech KAYAC Advent Calendar 2023の12日目の記事です。 Unityを触る傍ら、blenderもいくらか勉強を進めていて、その結果昨年から今年にかけてblenderを使った「オリジナル3D埴輪メーカー」という案件に携わりました。 www.kayac.com この案件では、利用者の顔を3Dスキャンし、そのデータをかわいい埴輪の3Dモデルと合体させて3Dプリントすることで、「自分の顔の造形をしている埴輪」という架空の遺物を生み出すことに成功しました。 記事では、どのようにしてオリジナル埴輪を作り出したのか、その技術背景について解説いたします。 目次 そもそもオリジナル3D埴輪メーカーとは iPhoneアプリ「Heges」で顔をスキャンする スキャンデータどう扱うか問題 スキャンモデルのク

    blenderを使って「自分の埴輪」を作る:藤井寺市 オリジナル3D埴輪メーカーの事例 - KAYAC engineers' blog
  • Webサービスの急激なアクセス数増加を予測して対処する方法と実践 - KAYAC engineers' blog

    どうも、ゲームコミュニティ事業部Tonamelのサーバサイド担当の谷脇です。 今回はTonamelのサービス特性上、どうしても発生する急激なアクセス数の増加(以下スパイクアクセス)をどのように対処しているかをお話します。 Tonamelのサービス内容については以前の記事に書いています。一言でいうと「誰でもeスポーツ大会の運営ができるサービス」です。 Tonamelの特徴 大会が開始したときに発生するスパイクアクセス スパイクアクセスの様子 上記は、あるゲーム大会が大会を開始した10:40ごろのリクエスト数の遷移です。Tonamelは大会の開始と同時にトーナメント表が公開されます。大会に参加している人はもちろん、観戦を行っている人もトーナメント表を見に来ます。観戦する人の同期としては、知人や推しの選手のトーナメント表上での位置や、相手を確認しに来ているようです。 Tonamelに限らず、We

    Webサービスの急激なアクセス数増加を予測して対処する方法と実践 - KAYAC engineers' blog
  • 動的コンテンツを画像化できるJSライブラリ "html2canvas" を使おう - KAYAC engineers' blog

    こんにちは、HTMLファイ部新卒の石崎です。 今回は、Webページを画像化できるJavaScriptライブラリ、html2canvas について紹介します。 html2canvasを上手に活用することで、Webサイト側で表示ページのキャプチャを用意して処理したり、ユーザに提供したり出来るため、作れるWebサービスの幅がきっと広がります。 スクリーンショットを撮る html2canvasを使うとWebページのキャプチャを作れますが、そもそもスクリーンショットを得る方法は他にいくつもあります。 Webページの見えている部分のキャプチャをユーザが撮る Mac command + shift + 4 + space Windows Alt + PrintScreen このコマンドで、Webページのウィンドウに表示されている部分のキャプチャを撮ることができます。 スマートフォンであれば、端末の電源ボ

    動的コンテンツを画像化できるJSライブラリ "html2canvas" を使おう - KAYAC engineers' blog
    yuiseki
    yuiseki 2022/01/01
  • LIDARではじめる、ギラギラAR - KAYAC engineers' blog

    この記事はTech KAYAC Advent Calendar 2020の19日目の記事です。 こんにちは。CL技術部の藤澤覚司です。 普段はUnityを使ったAR開発などを行っています。前回の記事では、可愛いキツネさんがsoft particleの中を走り回っていましたね。コンコン。 最近サイバーパンク2077が発売されましたね。職場の人間はみんなサイバーでパンクな物が大好きなので、僕もすぐ買いに行きました。 www.spike-chunsoft.co.jp サイバーパンク2077をプレイしていて感じましたが、やっぱりギラギラしているサイバーな街並みを見ていると、テンションが上がってきますね。僕の代わり映えしない日常もギラギラと発光していたらいいのに。だから僕はhololiveを見るための板になっていたiPadをおもむろに取り出しました。 作りたかったもの ARKit3.5から新しく追加

    LIDARではじめる、ギラギラAR - KAYAC engineers' blog
  • ゲーム内お知らせをHugo+Netlify CMS+CircleCIで作りました - KAYAC engineers' blog

    鎌倉は寒いです。みなさんはいかがですか。ソーシャルゲーム事業部のゲーム技研チームの谷脇です。 この記事はTech KAYAC Advent Calendar 2019 Migration Trackの10日目の記事です。9日目はデーモン管理をdaemontoolsからsystemdに移行させるでした。 ゲーム内お知らせとは みなさんは、スマートフォンのゲームをされますか。ええ、そこのあなたはよくされる。しかし、そちらの方はあんまりされない。なるほどなるほど。 では分かる人にはおさらいとして、あまりピンとこない方にはそんなことがあるのか〜となってもらうために説明させていただきます。 我々カヤックでゲームを運営している人々が「お知らせ」を指した場合、ゲーム内のある機能を示しています。他のゲームではニュースなどとも呼ばれています。 カヤックで作っているゲーム「ぼくらの甲子園!ポケット」(以下ぼく

    ゲーム内お知らせをHugo+Netlify CMS+CircleCIで作りました - KAYAC engineers' blog
  • 人間の行動を操るために覚えておきたい科学 - KAYAC engineers' blog

    この記事はTech KAYAC Advent Calendar 2019の4日目の記事です。 こんにちは。技術部平山です。 この記事では、人の行動を操る、つまり、人の行動を予測したり、望みの行動を取らせるために役立つ科学について 軽く紹介いたします。プログラミングの話はございませんが、 プログラマに読みやすい味付けにはしておきました。 なお、「人を操る」とか言っていますが、実際それで思うように操れるのであれば、 私はもっと裕福だったでしょうし、高い地位を得ていたことでしょう。 理屈と実践は異なるということです。 ただ、これを知って気が楽になる方もいらっしゃるかもしれませんし、 もしかしたら、実際に何かを改善させられるかもしれません。 基的には与太話ですので、お暇な方のみお付き合いください。 予測に使える理論は、制御にも使えるかもしれない 何かしらの理論によって現象が予測できるのであれば、

    人間の行動を操るために覚えておきたい科学 - KAYAC engineers' blog
  • ドキュメントがない機能をどうやって実装するか - KAYAC engineers' blog

    こんにちは。 iOS/Android エンジニアをやっている @Gemmbu です。 Advent Calendar には毎年参加しているのですが、誰にも記事が刺さらず毎度心がちょっと折れています。 ドキュメントがない機能をどうやって実装するか iOS 10 から Broadcast Extension という iOS/TvOS 端末の画面を配信する機能があります。 その機能にはドキュメントがありませんでした。(いや、最初は当になかったんです。いまは多少書かれています) 今回はドキュメントがない手探りの状態でどうやって実装していくかという手法のお話です。 なので、 iOS にも Broadcast Extension にも興味がない方でも読み物として楽しめれば幸いです。 そもそもドキュメントがない? モバイル開発では Apple 及び Google がドキュメントを整備しているのだからそ

    ドキュメントがない機能をどうやって実装するか - KAYAC engineers' blog
    yuiseki
    yuiseki 2019/09/19
  • Vueでもっと幸せになりたいあなたへ。VueのUIコンポーネントライブラリVuetifyのススメ - KAYAC engineers' blog

    どうもみなさまおはようございます。あるいはこんにちは。あるいはこんばんは。 KAYAC Advent Calendar 2018の12日目の記事を担当します、今年1月に中途入社しましたエンジニアのたがみです。 前職ではサーバーサイドのSEとして業務系のwebアプリを開発したり運用したりしていましたが、今はクライアントワークのフロントのエンジニアとしてwebサイトを作ったり動かしたりぶっ飛んだものにしたりしなかったりしています。 今回は、そんな私がフロントエンドになったばかりの頃に仲良くなった思い入れのある言語、Google App Scriptの話を!・・・・・・と、つい二日前までは、思っていたのですが。 Google先生を訪ねて色々と検索していたところ「あれ・・・なんか・・・Vuetifyについての日語記事、実は少ないのでは・・・?」と気づいてしまったのです。 (もしかしたら気のせいか

    Vueでもっと幸せになりたいあなたへ。VueのUIコンポーネントライブラリVuetifyのススメ - KAYAC engineers' blog
  • Dockerで開発環境構築を10倍楽にしたはなし - KAYAC engineers' blog

    Lobi事業部 サービス基盤チームの長田です。 最近プロジェクト内で使用する開発環境にDockerを利用するようになったので、その紹介をします。 Dockerにしたってどういうこと? 公開済みのWebサービスに変更を加えて動作確認をする場合、番環境でそれを行うわけにはいきません。 ほとんどの場合はローカルマシンでWebサービスの全体または一部のコピーを動かして動作確認を行うことでしょう。 その後ステージング環境などの他の開発メンバーも触ることができる環境で動作確認やQAを行い、 問題がなければ晴れて番環境に反映、という流れが一般的かと思います。 この「ローカルマシンでWebサービスのコピーを動かす」部分にDockerを利用している、ということです。 Dockerにしてどうなった? Before 開発環境構築に1〜2日かかっていた After 開発環境構築がランチに行っている間に終わるよ

    Dockerで開発環境構築を10倍楽にしたはなし - KAYAC engineers' blog
    yuiseki
    yuiseki 2017/10/27
  • DynamoDB + Lambda + SSM でテストサーバーをポコポコつくる仕組み - KAYAC engineers' blog

    はじめまして。カヤック技術部の杉山です。 主にクライアントワークでサービスを開発しています。 今回は、クライアントワークで運用している、テストサイトの仕組みに関して書きます。 「テストサイト」の概要 クライアントワークでは、日々たくさんの案件を開発しています。 それぞれの案件では、多くの場合、Webサイトもしくは、WebAPIを公開するためのサーバーが必要になります。 実際の公開時には、案件ごとに専用のクラウドコンピューティングサービスを契約し、セットアップすることになりますが、 利用して良いサービスの確認が必要であったり、サービスの契約まで時間がかかったりするため、すぐには決まらない場合があります。そのため、開発時や検証時には、カヤック側でテストサイトを用意し、確認やプレビューを行っています。 さらに以下のような要望にも対応する必要があります。 出来るだけ時間をかけず開発環境を用意したい

    DynamoDB + Lambda + SSM でテストサーバーをポコポコつくる仕組み - KAYAC engineers' blog
  • 突撃!隣のキーボード - KAYAC engineers' blog

    Lobiチームの長田です。 このエントリはTech KAYAC Advent Calendar 2016の8日目です。 昨日は「【DockerMySQLのフェイルオーバーをdocker-composeで構築」でした。 techblog.kayac.com 今回はゆる~く眺められる内容となっております。 皆さんキーボード使ってますよね。 他の人がどんなキーボードを使っているのか気になりますよね。 今回は何人かの社員にキーボードについてアンケートしてみました。 使っているキーボードは? そのキーボードを選んだ理由は? そのキーボードを選んでよかったことは? そのキーボードを選んで失敗したことは? ひとことコメント アンケートの回答を、実際にキーボードを使っている環境の写真と合わせてまとめてみました。 では見ていきましょう! osawa-junの場合 使っているキーボードは? Happy Ha

    突撃!隣のキーボード - KAYAC engineers' blog
  • ぼっちiOS開発者がParse(Parse.com)使った結果wwwwwwwww tech.kayac.com Advent Calendar 2013 - KAYAC engineers' blog

    このエントリーはtech.kayac.com Advent Calendar 2013の7日目のエントリーです。 いきなり釣りっぽいタイトルで申し訳ありません。 LobiチームでiOSエンジニアをしております@_somtdです。 今回急遽、@soh335さんのバーターとしてAdvent Calendar 2013にて寄稿させていただいております。 大変光栄な機会をいただきありがとうございます! 普段はカヤック社内でも屈指の大人数チームで開発をやっているのですが週末はぼっちでiPhoneアプリなどを開発しております。 今回は、ぼっちiOS開発者の強い味方!Parseについて書こうと思います。 Parseって何? ここで改めて説明をするよりも、ものすごく簡潔にまとまっているスライドがありましたのでシェアさせていただきます。 5分でわかったつもりになるParse.com from Kenta T

    ぼっちiOS開発者がParse(Parse.com)使った結果wwwwwwwww tech.kayac.com Advent Calendar 2013 - KAYAC engineers' blog
  • #21 AngularJS + soundcloud API で俺得 music player をつくる - KAYAC engineers' blog

    この記事は tech.kayac.com Advent Calendar 2013 21日目の記事です。 こんばんは。13新卒の @m0t0k1ch1 です。 @mackee_w さんに立てていただいた scala フラグを倒させていただきまして、、ここ1週間くらい1人でこそこそやっていたことについて書きたいと思います。内容は表題そのままの感じです。 soundcloud について soundcloud 有名な無料音楽クラウドサービス イケてる remix が多いので、ここで音楽を聴きながらコードを書くことが大半 ローカルに音楽ファイルを持ちたくないのでうれしい soundcloud に対して最近感じていた不満 家ではリピート再生が(曲単位・プレイリスト単位ともに)できないのでつらい SoundCloudRepeat.com もあるけど、決め打ちでリピート再生というよりかは、お気に入りの

    #21 AngularJS + soundcloud API で俺得 music player をつくる - KAYAC engineers' blog
    yuiseki
    yuiseki 2013/12/22
  • #20 RaspberryPiを仕事で使うためにAnsibleを使う話 - KAYAC engineers' blog

    この記事はtech.kayac.com Advent Calendar 201320日目の記事です。 どうも、Perlに洗脳されはしましたが、最近洗脳が解けPythonを書いています@mackee_wです。 最近はVOICE DRIVERや暗殺教室 殺ジェクションマッピング、X-TRAIL X-TECH GEAR PROJECTなどをやっているクライアントワークのデバイスチームでせこせこハンダゴテを握っていたりします。 そんな中で最近良く使っているRaspberryPiとAnsibleに関するいくつかのTipsを紹介させていただきます。 RaspberryPiについて 今までデバイスを作成する場合にはArduinoなどのマイコンボードやAVR、PICといったワンチップマイコンを使う場合が多かったのですが、RaspberryPiが強力すぎてArduinoと組み合わせて使う機会が多くなってきま

    #20 RaspberryPiを仕事で使うためにAnsibleを使う話 - KAYAC engineers' blog
    yuiseki
    yuiseki 2013/12/20
  • vimプラグインでよりよいコーディングを - KAYAC engineers' blog

    こりなくvimプラグインの紹介をします。北原(@soh335)です。 たかが、エディタですがプログラムを書く際には一番触っている道具です。イチローも道具は大切にすることが重要と言ってますし、メンテナンスしながら良い状態にしておきたいですね。 今回はvimプラグインの管理、プログラム書く自体には関係ないけど便利なプラグイン、実際にエディタを使っている際に便利なプラグインの紹介をします。 vimプラグインの管理 vim-pathogen http://www.vim.org/scripts/script.php?script_id=2332 vimプラグインは、windows環境はで$HOME/vimfiles/、mac等では$HOME/.vimのディレクトリの下にインストールしていきますが様々なプラグインを一つのディレクトリにいれると のようになり例えばこのプラグインが更新されたのでアップデ

    vimプラグインでよりよいコーディングを - KAYAC engineers' blog
    yuiseki
    yuiseki 2013/04/04
  • #16 「moshは確かにイノベーション」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog

    初めまして。HTMLファイ部兼ダーツ部のkubota(@kubosho_)です。 最近はAndroidブラウザーのレンダリングエンジンの気持ちになりながら仕事をしています。 このエントリーはtech.kayac.com Advent Calendar 2012 16日目の記事です。 Vimまじイノベーション さて、テーマが「私の中のマイイノベーション 2012」ということで、今年はいろいろとイノベーションがあったのですが、その中でもイノベーションだったのが「Vim」でした。 元々Emacs派だったのですが、弊社HTMLファイ部の部長である@edo_m18に「Vimいいよいいよ」と洗脳おすすめされた結果、Vimを使い出して今では8:2くらいの割合でVimを多く使っています。 しかし、それよりももっとイノベーションを起こしたものが昨日できました。 それがmoshです。 moshまじイノベーショ

    #16 「moshは確かにイノベーション」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog
    yuiseki
    yuiseki 2012/12/17