Web Design Articles

  • 1818

UniRxやってます

最近何も書いてなかったので、雑記をこんにちは、のすけです。最近は、これのシングルトンとかobservableパターンを読んでGame Programming Patterns ソフトウェア開発の問題解決メニュー impress top gearシリーズ作者:Robert NystromインプレスAmazonその後、UniRx勉強してますUniRx/UniTask完全理解 より高度なUnity C#プログラミング (アスキードワンゴ)作者:打田 恭平ドワンゴAmazonVue.jsなどでobservableをなんとなく使ってたのですがこれを読んで理解が深まりました。イベントと実処理を分離した実績達成システムを実装したくてたどりついた感じでゲームのパターンってなってますが、結構汎用的に、いろんなシステム開発で使える手応えを感じてます。 ではまた

  • 1877

電池ってなんだろう

技術的な文章はかなり時間がかかるので、ここで地球や社会について思うことなど雑記として書いて行こうと思います。最近ハマっているのが発電・蓄電です。 特に燃料電池にハマっています。そもそも電池ってなんだろう?と 蓄電ってなんだろう?と停電すると手も足も出ないじゃないですか。なんとかしたい訳です。 停電したらコンビニに電池を買いにいっても、争奪戦になる訳で、、、 だから、電池ってなんなのか知っておこうと思いました。iPhoneとかにケーブルを繋いで充電すると、電気が溜まるわけで一日利用できるわけですが これって実は電気っていうものが溜まっているわけじゃないんですよね。ただの化学変化で、最近のスマホではリチウムイオン電池っていう最新のものが使われているわけだけどこれって、電池の中でプラス極とマイナス極が2つあって、その間をリチウムイオンが移動する事(酸化還元反応)で電気を貯めたり、放出したりする現象を利用しているわけ イオンって?引用します( リチウムイオン電池の豆知識 - リチウムイオン電池の豆知識 ) イオンとは、電子の過剰または欠損により電荷を帯びた原子(または原子団)のことを言います。リチウムイオン(Li+)は、リチウム原子(Li)が電子(e-)を放出してプラスの電荷を帯びた陽イオンです。リチウムイオンが電解質を通して正極と負極を行き来するときに正極と負極を結ぶ回路に電子の流れ(電流)が発生するので、電池の充電・放電が可能になります。リチウム原子(Li)が電子(e-)を失ってリチウムイオン(Li+)となる反応を酸化、逆にリチウムイオンが電子を得てリチウムに戻る反応を還元反応といいます。リチウムはすべての元素の中で最もイオン化しやすい(イオン化傾向が強い)元素です。 つまり電荷を帯びたリチウム原子をリチウムイオンっていうわけ。で、電子が移動する事で、電流が流れるわけです。 で、リチウムイオン電池って最先端の電池なのでちょっと不安定かつ難しいんだよね。そんなわけで燃料電池がわかりやすくていい中学校の理科の授業で水の電気分解をやったと思うけど、その逆が燃料電池なんだよね。だから本当に簡単で、この北ガスのサイトにあるように、家庭で自作できる! えんぴつで燃料電池を作ろう!|自由研究おたすけガイド|北ガスキッズサイト それいけ!!エネルギー探検団そんな訳で燃料電池を自作しようかと思っとります。

  • 1878

KUSANAGI@Conohaでオブジェクトストレージ設定のベストプラクティス

こんにちは、のすけです。KUSANAGIを利用する理由として、今まで利用していたサーバーが遅いので 変えたいという動機が多いかと思います。しかしながら、前回紹介して方法だと、WordPressをKUSANAGIに移行する場合 既存のメディアライブラリの画像などが上手く認識されないなどの問題が出てきました。hollywis.hatenablog.com 他の方法を模索したところ、別の手法を見つけました。ConoHaオブジェクトストレージをマウントしてWordPressでのメディア保存先にする | サイト制作覚書ただ、こちらの手法ですとディスクのマウントに失敗する事が多いためあれこれと試し、最適な方法を見つけました。まず、手順通り cloudfuseを入れます。 cloudfuseを入れる yum -y install \ libcurl libcurl-devel \ fuse* fuse fuse-devel fuse-libs \ [...]

  • 1880

ConoHaのKUSANAGIで追加ディスクやオブジェクトストレージを設定する

こんにちは、のすけです。 前回、conohaで高速WordPress実行環境であるKUSANAGIを動かす記事を書きました。hollywis.hatenablog.comとても速くて快適なのですが、1つ問題があります。それはディスク容量です。初期設定でルートドライブがSSD50GBになっており 多少、心もとないのが実情です。そこで、cohohaのサービスを使ってその問題を解決します。方法は2パターン 追加ディスクを購入してマウントする オブジェクトストレージを使う 追加ディスク 作成方法 追加ディスクのマウント オブジェクトストレージ利用 Conoha APIの有効化 WordPressのプラグイン「ConoHa Object Sync」を使う 設定値 追加設定 おまけ KUSANAGIのドメインの再設定方法 それではざっくりと順番に説明していきます。 追加ディスク [...]

MakerFaire2014に行ってきた!

こんばんは。さいぞうです。 はりうすとして二人で行ったわけではないですが、東京ビッグサイトでやっていた MakerFaire2014というイベントに行ってきました。 なんか電子工作とか手芸とか、ハードウェアやモノを展示したり売ったりしているでかいイベントです。 *1 はりうすで今つくっているのはWebサービスばっかりなんですが、最近、そのうちこういうハードが絡むものをやってみたいよね、といっているので偵察してきました。 この記事では、僕が面白いと思ったブースについて紹介します。 歯磨きできるやつ 3Dキャラの女の子の歯磨きをできるやつ。 OculusのHMDをかけて、ARマーカーをべたべた張ったぶるぶる震える機能を持った棒を持つとできます。 なんかどっかで見たことあるが、この大賞のやつかな。 仮想アイドルの歯も磨ける ついに触覚もITで再現 :日本経済新聞 パン焼くロボット 3対の可愛いロボががんばってトーストを作ってくれるシステム。 本当は火を噴きますが、動きだけでした。結構可愛い。 ソーシャルロボ 1万円くらいの材料でつくれて、Webで操れる簡単な可愛いロボ。 子供や高齢者の相手をさせたいらしい。 東京都市大のプロジェクト Making Mugbot マグボットの作り方 | Nonproprietary Open Source Social Robot 電光掲示板ゴーグル かっこいい。 電子ペーパー時計 なんか聞いたことある。色がコロコロ変わる時計。 Makuakeっていうクラウドファンディングサービスのブースだった。 追加購入受付! 柄が変わる電子ペーパーウォッチ「FES Watch」 | クラウドファンディング - Makuake(マクアケ) 天気が再現されるボックス なんかお洒落な透明な箱で、雨の日にはこの箱の中で雨が降る。くもりだともくもくする。 Ceatecでも見た気がする。 他にもあったが、これも作り方が公開されていて、自分で作ってもいい。 ブースの人は、一万くらいででいるといっていた。 Home - tempescope [...]

地元小樽に遊びに行ってきました! 続き!!

地元小樽に遊びに行ってきました! - hollywis's diary この続きです。 かもめ事務所 小樽を歩き回って政長に行った次の日は、小樽の市場でお洒落な雑貨屋hokkaiyaを営まれている大塚さんにお話を伺いました。 小樽で若者が新しいことをやるモデルを作ろうと、お父さんから受け継いだ市場のお店を改装し、雑貨屋さんを始めたそうです。 小樽で新しいこと、面白い試みを始めている、いろいろな人を教えてもらいました。 また、ETICというNPOの主催する地域イノベーター留学というプログラムを紹介していただきました。 面白そうなので、はりうすのふたりでエントリーしてみるつもりです。 地域イノベーター留学/地域で仕事を創りだすための実践型プログラム 地域イノベーター留学 | 地域で仕事を創りだすための実践型プログラム ちなみに小樽の中央卸市場では空きスペースへの出店と、上層階にある住居用物件の賃貸募集をしていました。小樽駅に近いのに、結構安くていいですね.... 育てるコワーキング その次は札幌に移動し、「育てるコワーキング」というコワーキングスペースにお邪魔して、いろいろとお話を伺いました。 育てるコワーキング札幌 育てるコワーキング札幌 - 北海道 札幌市 - スタートアップ、ビジネスサービス | Facebook 一応、Webアプリ開発の勉強会に参加させていただく、ということでお邪魔したのですが、後半はほとんど我々はりうすの悩み相談の様な感じになり、 代表の能正さん、その日の講師の辻本さん、田中さんに小樽の観光についていろいろな情報、ご意見をいただきました。 大変お世話になりました... 朝里川温泉 次の日は、とある事情があり、はりうすのふたりで小樽にある温泉地、朝里川温泉にある全ての日帰り温泉に入ってきました。 初めて小樽駅からバスで行きましたが、意外とすぐ着くのに驚きました。 それぞれの温泉ついてもまたホックー!でレポートしますが、いろいろと個性があり、前日歩き回った疲れをいやすことができました。 宏楽園は庭と露天風呂が素敵な高級感のあるお風呂。 湯の花朝里殿はとにかく広く設備が充実していました。入浴後は二階で昼寝するのがおすすめです。 朝里殿|湯の花ホームページ 武蔵亭はサウナやジェットバスがあります。湯の花から武蔵亭は結構遠かったので、て疲れをいやせました。クーポン利用で500円で入れるのも魅力です。 温泉:朝里川温泉 ホテル武蔵亭 自販機でガラナが売っていたので買ってしまいました。 ホテルクラッセは明るい内風呂が良かったです。ちなみにあんかけ焼きそばの団体に加盟していてレストランで食べられます。 小樽朝里クラッセホテル【公式サイト】 小樽朝里川温泉のリゾートホテル | 小樽朝里クラッセホテル【公式サイト】 かんぽの宿は、意外といっては失礼ですがレベルの高い露天風呂が魅力でした。 北海の美味が揃う小樽の奥座敷 ‐かんぽの宿 小樽 [...]

地元小樽に遊びに行ってきました!

photo by hualum 実は、遊びだけのために行ったわけではありません。 こんにちは。 さいぞうです。 はりうすは現在、ホックー!に続くサービスを模索中ですなのですが、 StartupWeekendに参加してリーンスタートアップの手法を再認識したり、いろいろ話し合いをしたりした結果、 我々のふるさとである、北海道小樽でやってみようかという話になりました。 そこで、ネット上の情報を元に考えたビジネスプランについて、市場調査や情報収集のために、小樽に行ってきました! 本日は訪問した場所について簡単にご紹介しようと思います。 小樽市役所 観光振興室 初日は、小樽市役所の観光振興室にお邪魔して、小樽の観光の状況、特に外国人観光客対応やインターネット接続環境についてお話を伺いました。 台湾や香港、タイ等のアジア系の観光客が多いことや、オンシーズンには宿がいっぱいで予約できないほどなのに、逆にオフシーズンには宿が余ってしまう現状等、興味深い情報を教えていただきました。 また、小樽では、今、町おこしの一環としてB級グルメ「あんかけ焼きそば」の普及に力を入れており、先日郡山で開催されたB-1ぐらんぷりでも9位に入賞される等、勢いがあるそうです。 B-1グランプリ入賞!小樽あんかけ焼そば - トピックス | 朝里クラッセホテル B-1グランプリ入賞!小樽あんかけ焼そば - トピックス | 朝里クラッセホテル 龍鳳 実は私は小樽出身ですが、今まであんかけ焼きそばを食べたことがありませんでした。 せっかくなので、その日の夜は、小樽駅にほど近い龍鳳という人気店にうかがって、たまり醤油を使った黒いあんかけ焼きそばを食べました! テーブル向こうに写っている田村との比較でお分かりと思いますが、超巨大です! しかも、二玉で800円というリーズナブルさ!! おなかが破裂しそうになりましたが、意外とあっさりとした風味で、すぐ平らげることができました。 政長 翌日は、小樽駅前や運河などで、外国人の方に小樽観光についてのアンケート調査を実施しました。 協力していただいた観光客の皆様、ご協力ありがとうございました! また、小樽の街を歩き回り、穴場な観光資源を探しました。 写真は手宮の廃線です。紅葉が始まっており、きれいな景色を楽しめるお散歩スポットでした。 その日の夜は市役所に勤める同級生に紹介してもらった、花園にある鶏料理のお店、政長にお邪魔しました。 お料理はとても美味しく、中でも往年の小樽の賑わいを感じさせる「たたき鍋」が絶品でした! これは小樽にかつてたくさんあった料亭で出されていた鍋料理をご主人が復活させたものです。 鶏スープで炊いた鶏肉、つみれ、豆腐等を、大量の大根おろしにつけていただく上品な鍋料理で、最後の雑炊まで最高でした! 詳しくはホックー!の記事でご報告します!!! ちょっと長くなってきたので、後半は次の記事にまとめます。 地元小樽に遊びに行ってきました! 続き!! - hollywis's diary 地元小樽に遊びに行ってきました! 続き!! - [...]

WimaxのルータをWimax2+対応のNAD11にしたよ

こんばんは。さいぞうです。 前に紹介しましたが、我々hollywisのオフィスは年季の入ったアパートの一室です。 というか、オフィスとして使っているのは単に私の住んでいる部屋で、そこに相方が毎日来て作業している形です。 そこでいろいろな開発をしているわけですが、ネット環境も私が私的に契約しているWimaxに二人で接続するという感じでした。 回線は意外と速くてだいたいは不自由なく使えるのですが、打ち合わせのためGoogle Hangoutを二人で使うときにちょっと違和感を感じていました。 そんな中、今月ちょうど今のWimaxの一年縛りの契約の更新月を迎えたので、回線をより高速なものに切り替えることにしました。 Wimax2+ 最初は光回線に変えようと思っていたのですが、hollywisとしての次の一手の関係上、この部屋に長居しないかもしれないので、引っ越しても手続きが楽ちんなWimaxのままで、より早いやつにすることにしました。 次世代サービス「WiMAX 2+(「ワイマックスツープラス」)」について|UQ WiMAX|超高速モバイルインターネットWiMAX2+ 次世代サービス「WiMAX 2+(「ワイマックスツープラス」)」について|UQ WiMAX|超高速モバイルインターネットWiMAX2+ ふつうWimaxが最大40MbpsなのがWimax2+だと110Mbpsになるらしいです。 まあ速度が倍くらいになるならHangoutは安定しそうだな、というのと いろいろ調べて料金は今+500円くらいらしいので、いいか、と思い決めました。 @niftyにした UQ Wimaxの回線を間借りした感じでサービスを提供している会社は結構たくさんあります。 あんまり深い意味はないのですが、今回今までのワイヤレスゲートから@niftyにしてみました。 株式会社ワイヤレスゲート | 全国どこでもワイヤレスブロードバンド 株式会社ワイヤレスゲート | 全国どこでもワイヤレスブロードバンド @nifty WiMAXトップ | WiMAX(ワイマックス)なら@nifty @nifty WiMAXトップ | WiMAX(ワイマックス)なら@nifty サービス本体の値段はあまり変わりません。 決め手になったのは付随して使えるようになる公衆無線LANサービスです。 ワイヤレスゲートだと eo, wi2, mobilepointあたりが使えるのですが、wi2はプレミアムのところは使えません。 @niftyだとeoやmobilepointが使えなくなりますが、wi2のプレミアムのところもつながるようです。あとau Wi-Fiも。 僕の行動範囲だと後者の方が便利そうだったので変えました。 まあ大した差ではないですね。   プラン 契約したのは、 WiMAX [...]

公開前の新規サービスが疑似体験できる! HOLLYWIS LAB (はりうすラボ) 開始

HOLLYWIS LAB (はりうすラボ) 弱小スタートアップHollywisでは、日々新しいサービスの検証を行っています。もし、宜しければご協力いただき、みなさんも楽しんでいただけたらと考えています。 検証中のサービス参加はいつでも歓迎 (^^)/ 検証中のサービスにご参加される場合には、ルールに従っていただければ、どんどん参加して頂いてOKです。 もし、お名前を教えてくださるという方がいらっしゃいましたら、「info@hollywis.com」にメールください。なお、下のコメントでもOKです。 ---------------------------- ○○といいます。 ○○サービスに参加します。 ---------------------------- とだけ、ご連絡いただけると嬉しいです。 感想などのインタビューなどさせて頂き、参考にさせて頂きたいと思います。 現在実験中のサービス 自分も“○○まにあ”なれる、いろんな”まにあ”に出会える -HOLLYWIS LAB (はりうすラボ)- - hollywis's diary 自分も“○○まにあ”なれる、いろんな”まにあ”に出会える -HOLLYWIS LAB (はりうすラボ)- - hollywis's diary

自分も“○○まにあ”なれる、いろんな”まにあ”に出会える -HOLLYWIS LAB (はりうすラボ)-

■まにあんぬ(仮)--自分も“星空まにあ”なれる、いろんな”まにあ”に出会える-- ご自分のちょっと詳しいものの"まにあ"になって、発言していく実験です。※"まにあ"とはその道の専門家まではいかないまでも、ちょっと詳しい人と定義させていただきます。 ルール 1."まにあ"になる 自分がなる"まにあ"を選びます。自分がちょっと詳しいものがイイです。 Twitterアカウントを新規に作るか、既存のアカウントを用意します。 Twitterのテンプレートで。「#まにあんぬ」「#○○まにあ」というハッシュタグを2つと、スペースを1個あけてレベルを書いて次のような定型文をつぶやこう! 初めまして"自称○○まにあ"です。よろしくお願いします。 #まにあんぬ #○○まにあ Lv1 http://goo.gl/yHRNGD なお、"まにあ"は複数掛け持ちしてOK 2.普通に生活する あとは、普通に生活してください。ただし、あなたは「○○まにあ」であるという自覚を持って行動して下さい。 3.少しでも"まにあ"的な食指に引っ掛かるものがあったら投稿する 「○○まにあ」という自覚を持ったあなたなら、きっと投稿したいことがあるはず。 つぶやきでも、画像でも、なんでもOKです。「#まにあんぬ」「#○○まにあ」というハッシュタグを2つと、スペースを1個あけてレベルを書いて投稿しよう! 4.お気に入りする #まにあんぬ で検索すれば、まにあんぬに流れている"まにあ"情報が確認できます。 気に入った"まにあ"つぶやきは、どんどん★お気に入りしましょう! 「いいね!」をする感じで。 5.レベルアップする "○○まにあ"として、投稿したつぶやきで合計50お気に入りされたら1レベルアップです。 次からは「#まにあんぬ #○○まにあ Lv2」にしてください。 "温泉まにあ"と"遊園地まにあ"を2つ選んだ場合、"温泉まにあ"の発言で50★お気に入りされた場合は、"温泉まにあ"がLv2、"遊園地まにあ"がLv1です。 ※まにあ例 温泉まにあ、銭湯まにあ、廃駅まにあ、外人受けまにあ、人気スポットまにあ、隠れ家まにあ、絶品グルメまにあ、流行まにあ、マンホールまにあ、キャンプ場まにあ、遊園地まにあ、武蔵小杉まにあ、パンケーキまにあ、聖地巡礼まにあ、子供と遊べる場所まにあ、戦艦まにあ、漁港まにあ、釣りまにあ、孤島まにあ、沖縄まにあ、北海道まにあ、動物園まにあ、雨まにあ、空まにあ、星まにあ などなど。 ※"まにあ"としてじゃない発言がしたいとき そんなときはハッシュタグを変えます。 「#通りすがり #まにあんぬ」にしましょう。 通りすがりなので、"まにあ"から解放された自由気ままな発言ができますよ! ※レベルアップルール レベルは1つづつしか上がりません。どんなにお気に入りが多いからって、Lv1からいきなりLv3はなしですよ。 Lv1で50お気に入りあつめる。Lv2で50お気に入りをあつめる。Lv3で50お気に入りをあつめると順番に行きましょう! ※フォローする もちろんお気に入りの"まにあ"さんは積極的にフォローしていきましょう! 公開前の新規サービスが疑似体験できる! HOLLYWIS LAB (はりうすラボ) 開始 - hollywis's diary 公開前の新規サービスが疑似体験できる! HOLLYWIS [...]

babylon.js ステップ10 メッシュの交差衝突判定 (Intersect Collisions – mesh)

メッシュ同士が、それぞれ衝突を検出する方法をやりますいきましょう!! 説明 2つのメッシュが接触しているときに衝突イベントを発生させる方法 メッシュと1点間の接触を検出する方法 まとめ 説明 衝突検出の2つの方法を紹介します。 2つのメッシュが接触しているときに衝突イベントを発生させる方法 メッシュと1点間の接触を検出する方法 2つのメッシュが接触しているときに衝突イベントを発生させる方法 intersectsMesh()を使うことで、対象との交差(衝突)判定を行うことが出来ますコードは次の通り // 平面(plan1)とballoon1との交差判定 if (balloon1.intersectsMesh(plan1, false)) { balloon1.material.emissiveColor = new BABYLON.Color4(1, 0, 0, 1); } else { balloon1.material.emissiveColor = new BABYLON.Color4(1, 1, 1, 1); } バビロンエンジンでは、交差判定を効率よく行うために オブジェクトの周囲に下図のように境界ボックス(バウンティングボックス)を作成し、このボックスと衝突するメッシュの間の交差をテストします。 また、より詳細に接触を検出したい場合には第二引数をtrueにすることで、バウンティングボックスをメッシュにより近くし、交差判定を正確にすることが出来ます。ただ、この操作は計算負荷が高くなるようです。 左が、falseの例、右がtrueの例です。このタイプのバウンディングボックスは、メッシュをある角度に回転させる場合に特に役立ちます。 メッシュと1点間の接触を検出する方法 特定の1点との接触判定をする方法が、intersectsPoint()です。 使用方法は次の通り var pointToIntersect = new BABYLON.Vector3(10, -5, 0); if [...]

babylon.js ステップ9 カメラとメッシュの衝突判定&重力 (Cameras, Mesh Collisions and Gravity)

babylon.js を覚えようステップ9は衝突判定と重力制御です! いやー、重力とか楽しそうですね。 メッシュだけでなく、カメラにも設定できるようです。 いきましょう!! 説明 1.重力の設定 2.楕円体を定義する 衝突を適用する(Apply collision) メッシュオブジェクトとメッシュオブジェクトの衝突 ArcRotateCameraでの衝突 まとめ 説明 FPS(First Person Shooter)ゲームをプレイしたことがありますか?この回では、そのFPS的なカメラの動きをシミュレートします。カメラは床にあり、地面と衝突しており、シーン内のオブジェクトと衝突している可能性がありますねでは、このFPS的な設定をしていきましょう! 1.重力の設定 シーンにグラビティ(重力)ベクトルをVector3型で設定します。 scene.gravity = new BABYLON.Vector3(0, -9.81, 0); 古典的には、yに重力加速度9.8を下向き(負)に設定すると良いです。カメラへの適用は、applyGravityプロパティをtrue設定します camera.applyGravity = true; 2.楕円体を定義する 次の重要なステップは、カメラの周りに楕円体を定義することらしいです。この楕円体はプレーヤーの幅(プレイヤーサイズ)を表します。外部のメッシュがこの楕円体に接触すると衝突イベントが発生し、カメラがこのメッシュに近づきすぎないようにすることで、カメラがメッシュにめり込まないようにします。 babylon.jsカメラの楕円体プロパティのデフォルトはサイズ(0.5、1、0.5)ですが、値を変更すると、調整された軸に応じて、背が高く、大きく、小さく、薄くなります。次の例では、カメラの楕円体をデフォルトの楕円体よりも少し大きくします。 //カメラの周りに楕円を定義 (e.g. your player's size) camera.ellipsoid = new BABYLON.Vector3(1, 1, 1); カメラの楕円体はオフセット(Offset)され、常に視点が楕円体の上にあります。camera.ellipsoidOffsetプロパティを更新することにより、この動作を制御できます。計算は次のようになります。finalPosition = position - vec3(0, ellipsoid.y, 0) [...]

Let’s Work Together

Tell me more about your project

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.