当ブログの目次

　このブログのテーマは、『やってみて、メモる！』です。
　
　プログラミング、画像・音声作成等、興味を持ったものをやってみて、その実践内容を記事にしています。
　Macの操作やはてなブログのカスタマイズに関する記事もあります。
　
　自分がまとめた内容も、時間が断つと忘れちゃうので、手順などを詳しめに書いています。
　記事が増えてきたので、分類してみました。

目次

Cocos Creatorによる開発

　Cocos CreatorはCocos2d-xエンジンの最新の総合開発環境です。
　コードエディタとビジュアルエディタ（UI、アニメーションの作成）が一つになっています。
　JavaScriptで、iOS、アンドロイド、Web、Mac向けのアプリが作れます。
　
　インストールして環境を整えたら、最初はマニュアルのチュートリアルがオススメです。Cocos Creatorによるアプリの開発の概要がわかりやすいです。

• Cocos Creatorのインストールからデバッグ環境の作成まで行う！
• プロジェクトの実行とビルドを確認する！
• エディタの画面構成と基本的なゲームの作り方を調べる！
• マニュアルのチュートリアルをやってみる！ その１
• マニュアルのチュートリアルをやってみる！ その２
• マニュアルのチュートリアルをやってみる！ その3（完）
• スクリプトのPropertiesについて
• addChild、addComponentについて
• デバッグ環境について
• 仮想ジョイパッドを作る！
• マニュアルの『アニメーション』を読む！ その１
• マニュアルの『アニメーション』を読む！ その２（完）
• cc.Spriteの属性値について
• ListViewを作る！ その１
• ListViewを作る！ その２（完）
• ２Ｄキャラクタアニメーションをテスト！ その１
• ２Ｄキャラクタアニメーションをテスト！ その２
• ２Ｄキャラクタアニメーションをテスト！ その３
• ２Ｄキャラクタアニメーションをテスト！ その４
• ２Ｄキャラクタアニメーションをテスト！ その５（完）
• JSONファイルの読み込み

ちょっと番外編でCoffeeScriptについて

• CoffeeScriptについて調べてみる！
• CoffeeScriptを使ってみる！

Node.js

• Node.jsをMacにインストール！（Homebrew→Nodebrew→Node.js順にインストール）
• 同期・非同期処理で、フォルダ内のファイルを列挙する！
• Visual Studio Codeでデバッグする！
• フォルダ内のファイル名に連番を付ける！（ちょっと対話型）
• match()とreplace()を使ってファイル名を変更する！（ちょっと対話型）

Google Apps Script

　Googleドキュメント、Googleスプレッドシート等、無料で使えるオンラインのワード・エクセルのようなアプリがあります。
　ワード・エクセルのマクロにあたるのがGoogle Apps Script（略称GAS）で、機能の追加したり自動化したりできます。
　これもCocos Creatorと同じくJavaScriptで書きます。
　Webサービスゆえの制限もあったりしますが、おもしろいですよ。

• テーブルタグをGoogleスプレッドシートで作る！
• googleドキュメントで、ソースコードのインデント設定とHTMLタグの作成！
• セルのデータをWebで検索する！（英単語の辞書引き）：Googleスプレッドシート
• ピボットテーブルの使い方を調べる！：Googleスプレッドシート
• 年賀はがきの宛名印刷を作る！：Googleスプレッドシート

Cocos Studio 2とCocos Code IDEによる開発

　Cocos Creatorと同じく、Cocos2d-xエンジンの開発環境です。
　こちらは、コードエディタとビジュアルエディタが別々です。
　Cocos Studio 2は、UIやアニメーション等が作れるCocos2d-xのビジュアルエディタです。
　コードエディタは、自由に選べますが私は『Cocos Code IDE』を使用しています。

• Cocos（Ver.2.3.1）のMac（OSX Yosemite 10.10.5）へのインストール
  • 『Cocos』には『Cocos Studio 2』が含まれる。
• Cocos Code IDEの入手について
• Cocosを試してみました
  • 初めてCocosを使用した時の動作確認の記事
  • 慣れない環境にいろいろ苦戦。
• 『Cocos Framework』のバージョンを『v3.7.1』から『v3.7』に下げました
  • バージョンによる不具合の回避の記事。
• シーンごとの『.jsファイル』の追加
  • 『Cocos Studio2』で画面作成して『Cocos Code IDE』でコーディング。
• Cocos v2.3.2へのアップデートについて
  • アップデートしたけど、、、の話。
• Cocos Code IDE（v1.2.0）のコード補完のキーバインド（ショートカット）の変更方法
  • Macのショートカットとかぶるので変更する方法。
• クラスの継承：Cocos2d-x v3.7（JavaScript）
• 周期処理：Cocos2d-x v3.7（JavaScript）
• スプライトシートから画像を取得：Cocos2d-x v3.7（JavaScript）
• アクションの設定：Cocos2d-x v3.7（JavaScript）
• ボタンをコードで作成（スプライトシート利用）：Cocos2d-x v3.7（JavaScript）
• SneakyInput（仮想ジョイパッド）のJavaScript版の作成：Cocos2d-x v3.7（JavaScript）
• Cocos Studio 2によるアニメーションの作成 その１：Cocos2d-x v3.7（JavaScript）
• Cocos Studio 2によるアニメーションの作成 その２（完）：Cocos2d-x v3.7（JavaScript）
• Cocos Studio 2 - CheckBoxの使い方：Cocos2d-x v3.7（JavaScript）
• Cocos Studio 2 - ProgressBar（LoadingBar）とSliderの使い方：Cocos2d-x v3.7（JavaScript）
• 物理演算エンジン（Chipmunk）の使い方：Cocos2d-x v3.7（JavaScript）
• クリッピングマスク（画像の切り抜き）の設定方法：Cocos2d-x v3.7（JavaScript）
• 公式サイトのチュートリアルをやってみる その１ - タイルマップの作成：Cocos2d-x v3.7（JavaScript）
• 公式サイトのチュートリアルをやってみる その２ - Cocos Studio 2で画面作成：Cocos2d-x v3.7（JavaScript）
• 公式サイトのチュートリアルをやってみる その３（完） - コーディング：Cocos2d-x v3.7（JavaScript）
• Cocos v2.3.3へアップデートしました
• Cocos Studio 2 - ListViewの使い方：Cocos2d-x v3.9（JavaScript）
• Cocos Version 3.10を試してみました
• 値を保存する方法（Local Storage）：Cocos2d-x v3.9（JavaScript）
• JSONファイルの読み込み：Cocos2d-x v3.9（JavaScript）
• SneakyInput-JSを修正しました（『ColoredCircleSprite.js』を削除）
• 倉庫番のようなテキストゲームを作る：Cocos2d-x v3.9（JavaScript）

JavaScriptあれこれ

　JavaScript初心者（CやVB等は多少経験が有り）の記事

• 関数の宣言：JavaScript
• 連想配列：JavaScript
• 『var』と『let』、『==』と『===』の違いについて：JavaScript
• 経過日数の計算：JavaScript

画像作成

　アプリのUIの装飾を作成します。

InkScape

• InkscapeのMac（OSX Yosemite 10.10.5）へのインストール
  • InkscapeはAdobe Illustratorのようなベクター画像作成ソフト。
  • 無料で使えて、高機能。
  • 操作にはちょっと慣れが必要かも。
• Inkscapeのショートカットをcontrolからcommandキーに変更
  • インストールしたら、これを設定しておくと便利。
• 2Dキャラクタを描いてみる！
• 2DキャラクタをInkscapeで描く！ その１
• ２ＤキャラクタをInkscapeで描く！ その２
• ２ＤキャラクタをInkscapeで描く！ その３
• ２ＤキャラクタをInkscapeで描く！ その４（完）

Blender

　Blenderは無料の高機能3DCG作成ソフトです。
　これが無料とはびっくりです。
　基本操作を紹介しています。InkScapeと連携することもあります。

• Blender（3DCG作成ソフト）のMacへのインストール
• Blender（3DCG作成ソフト）の3D Viewの設定と操作
• Blender（3DCG作成ソフト）でパネルを作る その１ - 形状の作成
• Blender（3DCG作成ソフト）でパネルを作る その２（完） - 材質・カメラ・照明・出力の設定
• Blender（3DCG作成ソフト）で縁付パネルを作る
• BlenderとInkscapeでパネルを作る その１ - Inkscape編
• BlenderとInkscapeでパネルを作る その２（完） - Blender編
• Blenderで2Dのロゴが光るアニメーションを作る
• ガラスのようなマテリアルの設定：Blender
• Weight Paint（ウェイトペイント）について調べる：Blender
• モーションキャプチャのデータを探す
• 単純な形の人体をモデリング！：Blender
• BVHファイル（モーションキャプチャデータ）をインポート！：Blender
• ボーンの構造を書き出してみる！：Blender
• CurveのBevelの暴走を直す！：Blender

音声作成

• Bfxrでアプリの効果音を作る
• GarageBandで効果音を作る

Webアプリを公開する方法！

　Cocos Studio 2で作成したWebアプリを公開する方法です。
　Cocos Creatorで作成したWebアプリも同様に公開できます。

• GitHubを使用するための各種設定
• 『GitHub』アカウントの取得と『SourceTree』のインストール。
• HTML5パッケージの作成
  • 『Cocos Studio2』でHTML5パッケージを作成。
• GitHub Pageで『HTML5パッケージ』を公開
• iframeで、はてなブログ内にWebアプリ（外部サイト）を表示する！

便利なアプリの紹介

• テキストファイルの串刺し検索：アプリの紹介
  • ソースコードファイルを集めて検索すると用例を探すのに便利。
• bmGlyphのヘルプと使い方
  • ビットマップファイル作成ソフト。有料だけど比較的安い。
• 無料のスプライトシート作成ソフト！（『Cocos Studio2』）
  • メインの使い方ではありませんが。無料ですし。

作成したアプリ

• パズドラ チャレンジ＆降臨系ダンジョン クリア報酬一覧
  • Webアプリ。

Apple手続き

• iOSアプリ開発用証明書（.cer形式ファイルと、.p12形式ファイル）の取得

Macの操作あれこれ

• iPhone6からMac（OSX Yosemite 10.10.5）への写真の取り込み
• Mac OS X El Capitanにアップデートしました
• Macの装飾キー（command、option等）の記号表記について
• Macでスクリーンショットを取る方法

はてなブログカスタマイズ

• はてなブログのフォント、見出し等をカスタマイズ！
• はてなブログにメニューバーを付ける！
• Google Adsenseの『ページ単位の広告』を設定！
• はてなブログでPCとスマホで内容を変更する！
• テーブルタグをgoogleスプレッドシートで作る！
• googleドキュメントで、ソースコードのインデント設定とHTMLタグの作成！

Cocosドキュメントを読んでみようシリーズ

　Cocos Studio2を使い始めた時の記事です。すでに内容が古くなっている物もありますが、まだ役立つ情報もあります。

• Cocosとは（About Cocos）
• Cocosの環境構成
• ゲームの作成 - プロジェクトの概要
• シーンとUI
• スプライトシート
• パブリッシュ
• コーディングとデバッグ
• パッケージとランタイム環境の設定