Pokemon GO(ポケモンGO)2017年06月02日(金)開発の現場をのぞいてみよう!:Pokémon GO の起動画面のデザインについてご紹介します。


Pokemon GO(ポケモンGO)2017年06月02日(金)開発の現場をのぞいてみよう!:Pokémon GO の起動画面のデザインについてご紹介します。

———————-

アップデート
2017年6月2日
開発の現場をのぞいてみよう!:Pokémon GO の起動画面デザイン

トレーナーの皆さん、

Pokémon GO が開発されている現場をちょっとのぞいてみましょう! 今日はみなさんがゲームを起動したときに目にする、起動画面のデザインについてご紹介します。

Pokémon GO の起動画面は、素敵なイラストを表示して、Pokémon GOを遊ぶときに周囲に注意しながらプレイいただくよう皆さんへ呼びかけています。これまで、起動画面のデザインはいくつか登場しましたが、これらをデザインする時に一番大切にしているのは、トレーナーの皆さんが、ゲームが起動して冒険に出かけるまで、いかにわくわくしてもらえるかです。 Niantic のデザイナー ”Mieke Hutchins” をはじめとするデザインチームと、株式会社ポケモンの協力により、Pokémon GO の素敵な起動画面は作られています。素晴らしいファンアートをいただいたり、起動画面を高画質な壁紙として使用したいなどのご要望をいただき、皆さんの熱意を日々感じています。 今日はそんな起動画面の制作の過程を”Mieke Hutchins”に聞いてみました!

Mieke Hutchins:

起動画面のデザインを始めるときは、まず、前後のイベントの予定や新しい機能のリリースなどを考慮し、どのポケモンを取り上げるべきかの議論を行います。このハガネールの画像のデザインをしたときは、Pokémon GO にジョウト地方のポケモンが登場したときだったのでそのお祝いをしたいと考えていました。また、最初のギャラドスが登場した起動画面のデザインへ回帰したかったので、ジョウト地方のポケモンたちのなかから、ギャラドスと似た形とサイズのポケモンをイメージして、ハガネールを取り上げることになりました。 次にコンセプトの下書きが始まります。人をひきつける構図、ライティング、興味深い色使いのため、たくさんの芸術書、インターネット、自然界を参考に案を練ります。このリサーチが終わると、下図のようなシンプルなスケッチを作成し、チームで全体的な概念と構図について議論します。ここでは最終的にこの画像がどのようなものになるのかを決定します。

Pokemon GO Steeleix Thumbnail

スケッチの方向性に合意が取れたら、実際ゲームで利用しているモデルを画像にはめ込み、ゲームで表示される大きさ、ポケモンの特徴を忠実に再現できるよう準備します。ここではポケモンを見る角度、そして色彩設計についての決定も行います。私達が選ぶ色彩は、様々な照明の状況下、太陽光のもとでも見えるようにしなくてはなりません。Pokémon GOは外に出て楽しむゲームなので、この課題は私たちにとっていつも大きな挑戦です。今回はこの課題に対して、補色設計を選び、まず青とオレンジの色付けからはじめました。この時点でようやくこの画像がどんなものになるのか具体的に見えてきます。

Pokemon GO Steeleix Wireframe
Pokemon GO Steeleix Sketch 1
Pokemon GO Steeleix Sketch 2

ライティングを最適化し、イラストのムードを決定し、再度スマートフォンでの表示を確認し、ポケモンについての表現や詳細をチェックしてもらいます。 そしてとうとうハガネールの起動画面のできあがりです!後はエンジニアリングチームと一緒に次回みなさんがログインした時、この画像をご覧頂けるよう準備をするだけです。

Pokemon GO Steeleix Final

私たちはこの画像を制作する過程全てをとても楽しんでいます。皆さんも同じくらい起動時に表示されるこれらの画像を楽しみにしてもらえると嬉しいです!また、次はどんな画像になるのかもお楽しみに!

高画質のPokémon GO 起動画面の画像を閲覧、ダウンロードするには下の画像をクリックしてください。

Pokemon GO Halloween Loading Screen
Pokemon GO Holiday Loading Screen
Pokemon GO New Years Loading Screen
Pokemon GO Spring Loading Screen

今後、起動画面で見てみたいポケモンはどんなポケモンですか?ぜひ #PokemonGO のハッシュタグをSNSで利用して、私たちにも教えてください!

—Pokémon GO チーム一同

———-

UPDATES
June 2, 2017
Developer Insights: A look into Pokémon GO Loading Screens

Trainers,

We want to give you a peek into certain facets of developing Pokémon GO. For this post, we thought it would be fun to dive into the inner workings of what it takes to create a Pokémon GO loading screen.

We’ve seen that Pokémon GO loading screens and their gentle reminders to stay aware of your surroundings in fun and clever ways have received a lot of attention from the community. Typically, most discussions surrounding a loading screen revolve around the anticipation players feel before they start playing a game, but thanks in large part to Mieke Hutchins—our rock star artist at Niantic—brand and design experts at the Pokémon Company, and the rest of the design team at Niantic, this hasn’t always been the case with Pokémon GO. From outstanding fan art to requests for high-resolution wallpaper versions of each loading screen, we frequently see players sharing their love for the Pokémon GO loading screens. Because we’ve seen such amazing feedback about this artwork on various social media channels, we wanted to give you an inside look at the work that goes into creating a new loading screen with the help of Mieke herself.

Mieke Hutchins:

When designing a loading screen, the team starts by discussing what the most appropriate Pokémon to feature is based on surrounding events and the latest product release. In the case of the Steelix loading screen, we knew we wanted to celebrate the recent introduction of Pokémon originally from the Johto region to Pokémon GO. We wanted to create a throwback to the original Gyarados loading screen by using an epic Johto region Pokémon with a similar shape and size, and Steelix was the best fit. After choosing the most appropriate Pokémon to feature, it was then time to begin drafting concepts! We spent some time looking at references in various art books, online, and in nature for compelling compositions, lighting, and interesting color schemes. After we had done a bit of research, we created a simple thumbnail sketch (shown below) to discuss the overall idea and rough composition with the team. The plan at this stage was to have a strong sense of what the eventual artwork would look like.

Pokemon GO Steeleix Thumbnail

Once a rough sketch was created and everyone felt comfortable with the general direction, we placed the actual in-game models in the frame to establish scale and stay true to the precise look of the Pokémon. We also wanted to try to lock down the camera positioning, as well as start blocking in color. The color scheme we chose had to read on a phone screen in all kinds of lighting scenarios, including bright sunlight. That can sometimes be a challenge, because Pokémon GO is a game played on the move. We chose a complimentary color scheme for this reason and to heighten the contrast and tension in the screen, so we started with blues and oranges. At this point in the process, we really started to get a good sense for the look and feel of the loading screen.

Pokemon GO Steeleix Wireframe
Pokemon GO Steeleix Sketch 1
Pokemon GO Steeleix Sketch 2

Once we figured out the optimum lighting, composition, and mood of the illustration, we tested it one more time on the phone and worked with the brand and design experts to add any final touches to the screen. And voilà—our Steelix loading screen was ready to go! We then worked with our Engineering team to implement it in the live product for you to see the next time you logged in.

Pokemon GO Steeleix Final

We really hope you enjoy checking out these loading screens as much as we enjoy making them. Stay tuned to see what’s coming up next!

To view and download all four of the Pokémon GO loading screens in high resolution, click the images below.

Pokemon GO Halloween Loading Screen
Pokemon GO Holiday Loading Screen
Pokemon GO New Years Loading Screen
Pokemon GO Spring Loading Screen

Have a favorite Pokémon you’d like to see featured in the next loading screen? Tell us who you’d like to see appear on the next loading screen on your favorite social media channels using #PokemonGO and we’ll take your suggestion into consideration!

—The Pokémon GO team

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加
スポンサーリンク