インタラクティブな本を開発する物語





この記事では、子供向けの2冊のインタラクティブな本「The Mospet of Miss Moppet」と「The Tale of Kitten Tom」の開発に関する経験と経験を共有したいと思います。



そもそも、本で最も重要なことはテキストです。 そのため、本にとって翻訳が非常に重要であり、App Storeのアプリケーションに関しては、本のアプリケーションでは、高品質のローカリゼーションが非常に重要です。



アプリケーションブックを読むとき、子供と親は、インタラクティブ性、アニメーション、カラフルで鮮やかな写真、そして最後になりましたが、手紙に最も注意を払います。 しかし、世界中の開発者が試みている英語を話す子供たちとは異なり、ロシアの子供たちは、App Storeで動作する音声付きのロシア語のインタラクティブな本、つまり読みやすいテキストが強調表示されている最小の本を持っているのでそれほど甘やかされておらず、各単語を個別に聞くことができます、または単語内の1文字ですら! そのような本は言語の学習に役立ちます。



私たちはロシア語でインタラクティブな本を作ることを決定しました。

ブック検索



私たちの目標は、音声演技を備えた最高品質のインタラクティブな本を作成することでした。この本では、すべてのオブジェクトがクリックに反応するため、没入型の本シリーズと呼びました。 繰り返します。私たちの本の主な概念は、それらの中ですべてのオブジェクトがアクティブであり、何らかの形で反応しなければならないということでした。 適切な本を探して1週間になりました。



私たちは子供向けの本を作りたかったので、そのような本のテキストはシンプルで小さくなければなりません。 写真は明るくて面白いものでなければなりません。 ビアトリクス・ポターが前世紀の初めに書いたのはそのような本でした。 英語では、 絵本という用語もあり、ビアトリクス・ポターが重要な貢献をしたと定義されています。 素晴らしい作家が書いた本の全リストから、猫とネズミの人生の魅力的な物語である子供向けの物語「ミス・モペットの物語」が最初のテストに選ばれました。 結果は気に入っていますが、判断するのではなく、読者の方が気に入っています。



これで、最初の本「子猫トムの物語」で語られた物語の前編をリリースしました。 この本は1907年9月にリリースされ、それ以来、英国の児童文学の古典となっています。 素晴らしい親切な物語は、マナーと子供たちの振る舞いについて語っています。 2番目の本では、すべての古い開発を使用して、さらに効率的に、そして興味深いことにしようとしました。 私たちの意見では、新しいアプリケーションはさらに良くなっており、シリーズを継続します。



グラフィック素材の準備



本のイラストはすべて、前世紀初頭の最初の出版物から取られたもので、ビアトリクス・ポッター自身が描いています。 これにより、もちろん、キャラクターの作成、シーンの作成、イラストの作成にかかる時間と労力を少し節約できました。 私たちの仕事は、前世紀の初めに作成された写真を処理して仕上げることだけでした。 これを行うには、オブジェクトに分割し、背景と欠けている部分を描画する必要がありました。



古い写真を使ったインタラクティブな本をいくつか見つけました。 ほとんどの場合、すべてのオブジェクトが押すことに反応しない、またはオブジェクトが背景から切り取られない、率直に言って、いです。 背景全体が完成するように写真をカットすることにしました。 それぞれの写真について、欠落している部分のカットとペイントに多大な労力を費やす必要がありました。





プログラミング



私たちのチームにはプロのプログラマーが含まれていますが、iPhone向けの開発経験はありませんでした。それは大きなマイナスでした。



Objective-CとXcodeの研究を説明するのは意味がありませんが、非常に興味深いものでした。 最初は、C ++の後、Objective-Cの構文は非常に珍しいです。 しかし実際、彼には何の問題もありません。彼は新しいパターンを提供していません。言語自体が80年代に開発されており、まだ大きな変更を受けていないことを考えると驚くことではありません。



重要な問題は、アプリケーションが開発されているフレームワークの正しい選択です。

Cocos2dがフレームワークとして選択され、非常に人気があり、トップの多くのアプリケーションがその上で作られています。 Cocos2dには優れたドキュメントがあり、オープンソースであり、非常にコメントアウトされており、非常に透過的です。



C ++: Box2DまたはC: Chipmunk物理エンジンを選択する場合、C ++を優先して選択しました。

本をプログラミングする際、ターゲットプラットフォームがモバイルであり、リソースが限られているという事実に関連する多くの問題に直面しました。マルチスレッド、マルチタッチも大きな問題でした。 ただし、アプリケーションの安定性が達成されたことを願っています。





テキストレイアウト



テキストのレイアウトは、ソフトウェア環境で拡張し、動的に構成する必要があるため、簡単なタスクではありません。 しかし、ベクターフォントは、iPhone 3であっても、規模が小さいにもかかわらず非常に読みやすくなっています。



テキストを自動的に幅方向に引き伸ばすスクリプトを書くことは技術的に難しい作業ではありませんが、テキストが美しく見えるためには、単語間だけでなく文字間もフローティング距離が必要であるため、プログラマーにとってそれほど簡単ではありませんでした。 引き伸ばされたテキストは本来あるべき姿に見え、元のテキストに最も完全に対応します。





左から右:未延伸テキスト。 単語間の浮遊距離; 文字と単語間の浮動距離。



「アクトアウト」、プレス、発音の際にこれをさらに使用するためには、単語を互いに分割する必要があります。 言葉自体を再生するアニメーションはいくつかのオプションから慎重に選択され、私たちの意見では最も独創的なものが選択されたことに注意してください。



各単語は、音声ファイルと単語の時間に関連付けられている必要があります。



一般に、要約すると、テキストは開発時間の最大30%を占めると言えます。 しかし一方で、私たちは本を作ります、そして、テキストが半分以下の時間しかかからないことさえ奇妙です。



声優



本の項目がクリック音に反応しない場合、これは混乱と失望を引き起こします! 音の選択は最も重要です。 すべての音は互いに調和している必要があります。 それらは音量が揃っている必要があり、ノイズがなく、パチパチと音が聞こえないようにする必要があります。 音を追加して初めて、本は生き返った。



本自体のテキストは、表情豊かに読む必要があります。 ロシアの声の演技に問題はありませんでしたが、英語の声はすぐには利用できませんでした。 ネイティブスピーカーのみがアクセントなしで読むことができます。



The Stories of Miss Moppetを吹き替える最初の試みは失敗であることが判明し、ザンビアの少女は英国のアクセントを持ち、表情豊かに読むことができると約束されました。 実際、それは約束されたものではありませんでした。 時間を無駄にしただけです。 もう一度検索する必要がありました。 2回目の試みは成功し、この本は優れた英国英語で表明されました。



アプリケーションを使用して楽しむためには、BGMの音量を適切に調整し、テキストと効果音を読む必要があります。 同様の設定を試みた後、アプリケーションのサウンドを調整する機会をユーザーに与えるだけでよいことがわかりました。 したがって、本で目的のサウンドを実現するために、音楽と効果音の音量を個別に調整できます。 全体の音量は、デバイスボタンによって制御されます。 相対ボリュームは0%から300%まで調整できます。



まとめ



トライアルアプリケーションの開発には約3か月かかりました。 2番目の本は、より複雑で大きいという事実にもかかわらず、両方のアプリケーションの一般的な基礎を改善するために絶え間ない作業が行われたという事実にもかかわらず、たった1か月で行いました。たとえば、「Cut the Rope」のようにロープを追加しました。



次のビデオでは、私たちが得たものを簡単に見ることができます。









App Storeのリンク:

ミス・モペットの物語FULL Version

ミス・モペットLite版の物語



子猫トムの物語完全版

テイルオブキトントムLiteバージョン



PROMODYをより身近なものにしたい場合:

「ミス・モペットの物語」:

EXMWAYR9Y99A

LTYKJ3FYF6YL

XX9JA3HRNRKX

WRPLJ736FKNH

AR73K9RYLF96

ETP773379HY4

RFA9X4L96TFP

W3KNYFPATM9F

AWA7HJKLW9KA

7KL4APPNRYWT

JXPEPRFNAL4Y

N7YMH6RRF4PE

47NEAWM4W9WK

WK7YW9JPAWAK

RJA6P4NMJPP9



「子猫トム物語」:

TNEX4EEJNYHE

WPYFMF4LRTLN

J9F96XH9A4FK

FKR33E633LFR

7K3K6XPNP3MW

7YKTKLX6HR3L

R3Y9TW7HY4MH

X3NFJALARTAE

KTHYN6Y97KH4

TPYTTAAA3HNX

P3RHNW6XWHMN

WANWP7MTJ3K4

6AAJHREE3JML

66HHRP6L4A4J

W3TWYJNEJWXR



All Articles