Web Design Articles

  • 2039

Ask good questions and get better answers

Nulla sit amet nunc massa. Praesent sed est pellentesque, varius tellus non, efficitur nisi. Sed sit amet purus in odio varius tincidunt. Mauris ut ante lobortis, elementum orci efficitur, bibendum leo.

  • 1825

【Unity道場2】ゲームオブジェクトを表示、非表示

ゲームオブジェクトを表示、非表示をやります 問題1：ゲームオブジェクトを非アクティブにせよ 解答例 問題1：ゲームオブジェクトを非アクティブにせよ ゲームオブジェクトを非アクティブにせよ 解答例 using UnityEngine; public class Test : MonoBehaviour { void Start() { this.gameObject.SetActive(false); } // [...]

  • 1826

【Unity道場1】座標を移動させる方法：問題文つき (Transformコンポーネント)

Unityの書籍を使っていくつかゲームを作った後に気付きました。 何も身についてねぇーーー！本見ないと何にもできねxあーーー！ ということで、基本に立ち返って、ゲームを作る前にGameObjctの操作方法をC#のスクリプトレベルで覚え直すことにしました。 まず、１つ目！！ Transformコンポーネント 問題1：ゲームオブジェクトのx座標を一定毎に増やせ 解答例 問題2：ゲームオブジェクトのx座標を軸に回転させよ 解答例 問題3：ゲームオブジェクトのx座標成分に大きさを変えよ！ 解答例 問題1：ゲームオブジェクトのx座標を一定毎に増やせ ゲームオブジェクトのx座標を一定毎に増やせ 解答例 using UnityEngine; public class Test : [...]

babylon.jsで3D表現の初めの一歩

こんにちはどうしても3Dでゲームっぽい物をWeb上で作りたくて、ここ数ヶ月Three.jsを勉強していたのですが、、どうやらゲームを作るにはbabylon.jsの方が良さそうです。なぜ、Three.jsではダメなのか？それは純粋な3D表現ツールだからです。 キャラクターが簡単には歩いたりはしない 地面もただの平面オブジェクト 重力は自前でプログラミング などなど。 何ていうか・・・・全て自作が前提なのです。Unityであるように、重力を付与するモジュールとか無いです。誰かが作ってるかもしれないけれど、公式では無いです。これがとても辛いです。(あったら御免なさい。教えていただきたいです) ぽぽん！とゲーム作りたい！ じゃあUnityやりなさいよ！！ という話なのですが、どうやらWeb上では動作が遅いらしく家庭用ゲーム機とかPCやスマホにインストールする形式じゃ無いと辛いらしいです（未検証） あとは、JSで動かしたいんだ！！既存のWebサービスにシームレスに組み込みたいんだ！という話です。 そこで検討したのが、babylon.js(バビロンジェイエス)名前が、人類の愚かさの象徴であるバベルの塔を作り出したバビロンということで、全然いけてないのがとても気になるのですが。。。バベルの塔果たして、これは目的の物なのか、、 頑張って検証していきます。 www.babylonjs.com 執筆時点の最新版は4.1です。Microsoftのエンジニアが作った物らしく、フリーで使えますし、定期的にアップデートもされており、良さげです。Microsoftと言えばマインクラフト！！きっとマインクラフトみたいな物も、簡単に作れるんじゃないかと予想していますw ただ、babylon.jsにも、一つも問題が。。。。 それは、、、 babylonには日本語のドキュメントが一切ない！！　書籍もない！！ ということです。Three.jsには素晴らしい書籍がありました。 初めてのThree.js 第2版 ―WebGLのためのJavaScript 3Dライブラリ作者:Jos Dirksen発売日: 2016/07/23メディア: 単行本（ソフトカバー） ですが、babylon.jsにはありません。なので、このブログで説明しつつ、頑張って使っていきたいと思います。 それでは使っていきましょう。なお、Three.jsがある程度使える方を前提に買いていきます！もし、分からない場合は、コチラのThree.jsの書籍を買って、基本的なWebにおける3D表現のお作法を学んだ方がいいかもしれません。初めてのThree.js 第2版 ―WebGLのためのJavaScript 3Dライブラリ作者:Jos Dirksen発売日: 2016/07/23メディア: 単行本（ソフトカバー） まず球体を置いてみる 実行例 https://www.babylonjs-playground.com/#12S23Y コード全容 まずは、コード全容です <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Babylon Template</title> <style> [...]

私はサル以下なのか、、、と思ったあなたに。RPGに例えたGitの概念

ヒトにはもっと良い例えがあるはず！ そんなわけで、サルには理解できないRPGで、誤解を恐れずに例えてみた。いつも教えるときに例えて説明しているので、自分で整理するためにメモ。 概念だけなので正確には、こっちのGithubが出してるチートシートを確認してね。 https://github.github.com/training-kit/downloads/ja/github-git-cheat-sheet.pdf git init メモリーカードの初期化 全てはここから始まる。たまにPhpStormなど便利なIDEは勝手にやってる場合がある git clone 友達のセーブデータをメモリーカードにダウンロード。cloneから始める場合はinit不要。 git add セーブするものを選ぶ (RPGの中の状況のうち、セーブするものを選べる。お金だけとか、経験値だけとか、このキャラだけとか) git commit addした状態をメモリーカードへのセーブ git checkout セーブデータのロード(読み込み) git remote クラウドのセーブポイントの設定 メモリーカードではなく、インターネット上のメモリーカードに保存する(bitbucket, githubとか) 何個でも設定できる。 git push git remoteで設定したインターネット上のメモリーカードに保存。 git commit（手元のメモリーカードに保存）した後にやると、そのデータがネットにもコピーされる。 これで、手元にあるメモリーカードを紛失しても、水に濡らしてもセーブデータは失われない git pull インターネット上のメモリーカードカードの状態を 自分のメモリーカードに反映する。 友達が更新していた場合に、ちょくちょく、git pullしてやらないと、自分だけ古いデータで置いてきぼりを喰らう事があるよ。 git branch セーブデータの系列 条件分岐する箇所で、一旦セーブすると思います。 masterブランチは、メインのセーブデータ。 そのほかのブランチは、サブイベント回収のセーブデータみたいなイメージ。 サブイベントを回収し尽くしたら、masterブランチにマージして、常にmasterブランチのセーブデータに統合させる事ができます！ それを、自分だけじゃなく、友達同士で、協力してサブイベント回収して、masterブランチに統合する事もできる！ git rebase [...]

Nuxt.js × Cordvaでスマホアプリを作ろうとしたメモ

Nuxt.jsでcordovaを利用してiOS,Andoroidアプリが作れたらいいなという 意欲的な事をふと思ったのでやってみたメモです。 Nuxt.jsで作成したWebサイトを簡単にCordovaアプリ化する方法【ホームページを簡単アプリ化】 – こまめ この設定をやってCordova公式のGet Startedを実行https://cordova.apache.org/ cordova platform add browserをやって実行するとブラウザで開けます。 意味ないやん。Webブラウザで開いても。。なので、andoroidプラットフォームを追加します。 ちなみに、npm generateしてdistフォルダにソースが履かれたらwindowsの場合は robocopy dist/ cordova/www/を実行するとcordovaフォルダにソースをコピーできます。 Androidプラットフォーム実行 andoroidプラットフームを追加します cordova platform add android次にビルド cordova build andoroid 結論 いまいち。Nuxt.jsで動いたは動いたけど パスが変だったり、Cordovaがブラックボックスでメンテしずらそうだったり。 iOSだと挙動が不安定なので辞めました。Quasar FrameworkというNuxt.jsっぽくて、モバイル向けのフレームワークがあるので そっちに乗り換えようと思います！ Cordvaの上位互換のCapacitorってのがあるみたいだしね。

WSLにRails6環境を構築する方法メモ

Rails6Macでは難なく入ったのですが、、、WindowsのWSLではちょっとてこずったので、現状行ける方法をメモしておきます 【前提】 あらかじめWSLのubuntuが入っているものとします。ない場合はMicrosoftStoreからインスト―ル Ruby: 2.6.3 Rails: 6.0.2.2 Windows10のWSLを使っていきます # VSCodeをインストール VSCodeのリモートがとても便利なので入れていきます。 サイトに行ってダウンロードしてきます Visual Studio Code – コード エディター | Microsoft AzureRemote-WSLのプラグインをインストール 起動後に左下の緑の「>

nginxインストール＆起動＆停止＆設定（ubuntu）

インストール sudo apt-get update sudo apt-get install nginx 起動 sudo nginx 起動後に nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)みたいになるなら、すでに起動しているかも ps aux || grep nginxで起動しているプロセスを確認 終了 sudo nginx -s stop サービスでの起動&停止 sudo service nginx start sudo service nginx stop 設定ファイル 設定ファイルの所在地は次で確認できる sudo nginx -tsudo vi /etc/nginx/nginx/confServer項目をこのように設定して nginxを再起動するとブラウザでlocalhostで開けるServer項目htmlディレクトリのパスは [...]

container staton docker ubuntu初期設定メモ

いろいろインストール apt update IP系 apt install apt install iproute2 エディタ /etc/init.d/ssh restart ssh apt install openssh-server locale系 apt install language-pack-ja-base language-pack-ja ibus-mozc echo 'export LANG=ja_JP.UTF-8' >> ~/.bashrc cho 'export LANGUAGE="ja_JP:ja"' >> ~/.bashrc IPを表示 ip address show rootパスワード設定 passwd root QNAP container station固有設定 IPをブリッジにして、インターネットとのIN/OUTできるようにする(QNAP本体と同じセグメントになる) sshd起動 sshd_configを変更 nano /etc/ssh/sshd_config以下をyesに変える PermitRootLogin yessshdを起動。すでに起動しているならrestart /etc/init.d/ssh [...]

QNAPのWEBサーバーにSSL証明書を設定する方法

ゆえ合って、SSL証明書が必要になりました。QNAPで動いているQTS(QNAPの独自OS)はLinuxの独自拡張OSのようで SSHログインしてLinuxのように操作できます。以下、設定方法です。 SSHサービスを起動 まずは「ネットワークサービスファイルシステム」から 「SSH」をONにしてSSHターミナルからSSHでログインします。 apacheのSSL証明書の設定を実施 設定ファイルはここにあります more /etc/config/apache/extra/apache-ssl.conf記述中のこのあたりの部分を変更していく感じです。 SSLCertificateFile "/etc/stunnel/stunnel.pem" #SSLCertificateKeyFile "/etc/config/apache/server.key" #SSLCertificateChainFile "/etc/config/apache/server-ca.crt" #SSLCACertificatePath "/etc/config/apache/ssl.crt" #SSLCACertificateFile "/etc/config/apache/ssl.crt/ca-bundle.crt" #SSLCARevocationPath "/etc/config/apache/ssl.crl" #SSLCARevocationFile "/etc/config/apache/ssl.crl/ca-bundle.crl"必要なファイルを /etc/config/apache/　以下に設置します必要なファイルは以下の３つです。 ALPAH SSLとか安くてオススメです。 （Let's Encriptでもいいけど3か月ごとに更新するのがちょっとリスキー） Webサーバ証明書ファイル SSLCertificateFile /etc/config/apache/web.crt 秘密鍵ファイル SSLCertificateKeyFile /etc/config/apache/server.key 中間CA証明書ファイル SSLCertificateChainFile /etc/config/apache/server-ca.crt" apache-ssl.confのSSLの設定を以下のように修正 #SSLCertificateFile "/etc/stunnel/stunnel.pem" SSLCertificateFile "/etc/config/apache/web.crt" SSLCertificateKeyFile "/etc/config/apache/server.key" SSLCertificateChainFile "/etc/config/apache/server-ca.crt" #SSLCACertificatePath "/etc/config/apache/ssl.crt" #SSLCACertificateFile "/etc/config/apache/ssl.crt/ca-bundle.crt" [...]

そろそろSandyBridgeおじさん卒業。VRがしたくて新しい自作PCを組んだ話

こんにちは、のすけです。=== 去年書いて眠ってたので出しときます。 この記事で作成したPCはもう１年稼働中。いい感じです。 ただ最近はVRはしてませんorz === PCの温度管理は大切！なんて記事を8年前?に書いて、今でも結構みられているのですが。その時のPCが2010年に制作したCore i7 2600K(SandyBridge)を積んだhollywis.hatenablog.comこれです。 今話題？のVRが無性に気になってしまい。こちらの11年前のPCに思い切って GTX 1660 Superを買って強引にくっ付けて、さらに【国内正規品】HTC VIVE Cosmos EliteHTCAmazonVIVEのCOSMOS Eliteなんてのを買って、動くか試しました。 で、結果。 なんと、、、 動いたw 2010年のPCで動くんかいぃ！！すげえな2600K。全然カクツキも感じない。 ただ、一つ問題が。。。 どうやらSandyBridgeってUSB3.0に正式対応してないらしくて ただ、たまたまマザボがUSB3.0を搭載していたから奇跡的にCOSMOS Eliteがうごたわけなんだけど 起動が5回に1回動けばいい方で、結構な割合で起動しないことが多かったんだよね。 原因としては頭につけるガチャピンみたいなヘッドマウントディスプレイとPCを接続するUSB3.0の相性が悪いようだった。 ということで、11年ぶりに思い切ってPCを一新することにした。 構成はこうだ！ [構成概要] CPU: Ryzen9 3950x 16コア32スレッド メモリ: TEAM DDR4 3200Mhz PC4-25600 32GBx2枚 SSD: CFD販売 SSD 1TB 内蔵 M.2-2280(MVMe) 接続 PCIe Gen4x4 マザボ: MSI [...]

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.