Create video game characters, you can use your own concept, use free art as long as it is for personal use, or use AI to come up with quick images. Again, these characters are for use in the tutorial and not intended to use on a real project.
Once you have your video game characters, use Photoshop to edit the characters and backgrounds you'll use for the prototype.
Edit the character to thumbnail size art, 128x128 should be good for this example.
You'll use these as icons for choosing a character.
Now that you have all the art pieces, import them into Adobe XD.
While in Adobe XD, it's always good to set up your components. Like the font, colors, text sizes, and buttons.
Setting up is the most important task in Adobe XD. You need to think about how you want the screens to connect and duplicate screens showing the different states per screen.
For example, when changing characters, you need to show the button state for "selected" and doing so for all the characters.
Adobe XD will auto animate all of the button selection states as long as you made them a component. You want to give the user the experience that they are cycling through the characters for the prototype.
Next in the Prototype tab, you can now connect all the screens and navigation. You can use Keyboard and Mouse or connect your controller and press the button you want to use in order to do the action you want.
Here's an example of setting up your style and components in order to use the quickly and not have to manually change the font style or size in Adobe XD.
Once you have all the screens set up and the navigation. You have to export the into a raw video which you'll use to import into Adobe Premiere to add VFX, sound, and music.
You want to also think about button sounds as you move through the navigation. You can download free sounds online as long as they are free and only used for personal projects.
Now that the raw video, button sounds, and game soundtrack is imported you can begin to build the raw video to have more of a real feel.
This part may take some time to match the navigation movement to the button sounds. Timing the screen transitions and any other VFX you want to add in Adobe Premiere.
Here I'm adding some fire to the title to help transition to the option screen. It helps give it a more dramatic feel. I used a blending mode and dropped down the opacity in order to see the title screen.
Here I added all of the elements for button sounds and VFX. This part take time because you need to time all of the sound to match the video.
This is the final product. Here I add a soundtrack which really helps sell a complete prototype to now demo to a team and give a good idea of what you are pitching for how the opening of the game should go. You can always add more elements.
In this walkthrough video, I'll take you through my entire process of developing the 'Agency' game design concept, from initial brainstorming to a polished prototype. Using Adobe XD, I'll demonstrate how I crafted the game's user interface and interactive elements, highlighting key design choices and challenges along the way. Following this, Adobe Premiere Pro will be used to bring the fantasy world to life with dynamic visuals and seamless transitions. This video will offer an in-depth look at how I integrated story elements, gameplay mechanics, and visual aesthetics to create an immersive fantasy video game experience. Join me as we explore the creative journey and technical aspects of game design, providing insights into both the tools and techniques that shaped the final concept.
Special thanks to @ForeverDansky for his tutorial that inspired me to do my own spin. You can check out more of his tutorials and create your own concepts while learning more Adobe XD and Adobe Premiere Pro for your game projects.
