Mia Jocson
mia@evokedev.net
Career Goals
My goal for my career is to explore different roles in UI/UX design in different forms of digital media. I’m interested in how users experience interactive digital media, whether it’s finding information on a website, navigating through an app, or how a user experiences virtual worlds in a video game. As I am new to the field, I am interested in both smaller positions where I might have a wider range of roles, as well as larger companies that might give me more room to specialize. An extra area of interest of mine is in how modern and dynamic interfaces can maintain accessibility requirements to make sure every user can use them.
This portfolio is an example of my work that I created through my time as a student at UMGC.
1. Wave Space Shooter - CMST 315 - Game Design I, 2022
This project was part of an assignment that involved creating a game for CMST 315 - Game Design I class. The objective of the game is to survive each wave, and make it to the next level. The game has a total of four different enemies that spawn in various points. As you make your way through the waves, the enemies also become more powerful, making the game more difficult as you advance. Luckily, the game is forgiving enough. Throughout the map, there are various weapons available to you, and multiple health packs on different parts of the building. More importantly, there are places that you can run and hide, to figure out your next move. The style of this game is a mix of old and new sci-fi, assembled from free Unity asset store items.
2. Stardew Valley Profits - CMST 488 - Advanced JavaScript, 2021
This assignment was part of project 4, for CMST 488's Advanced JavaScript course. The goal of the Stardew Valley Profits site is to help users that play Stardew Valley, specifically how to determine the amount of various farming items. On the site, there are a number of tabs to choose from, including the User Guide that provides a complete description of how to use the calculator. FAQ’s for the common list of questions and answers; contact information and profits information. The contact page also includes how to connect with me using the site’s form. Another helpful part of the page is the profits information, which indicates what types of agriculture that you’ll want to invest in. Behind the scenes, this web page is built using JQuery and JSON to make a dynamic web page for the calculations. Neumorphic design was used to try to make the main center card of the page to have a sense of height through the use of shading.
3. Edge Evoke Magazine - CMST 310 - Fundamentals of Electronic Publishing, 2020
**Disclaimer: the magazine contents of this page was meant to build a magazine around existing content. While the original art of John Poppleton’s UV black lighting was not used in this fictitious magazine, the content of the magazine from his personal life and experiences were used for inspirational content and to complete this project.**
This assignment was part of project 4, for CMST 310’s Fundamentals of Electronic Publishing. We were required to create a fictitious magazine spread from scratch, without the usage of templates. The theme that I focused on was “Body Art”, this is when the idea of Edge Evoke Magazine was born. We had to come up with our own magazine name, so I thought the Edge Evoke Magazine was a good title for a fictitious magazine. The idea of body art has fascinated me for as long as I can remember. Whether it’s Henna Tattoos, or various body painting techniques, I'm almost always delighted to see the outcome of each piece. Edge Evoke Magazine's spread includes a cover page and two inside pages, totaling 3 pages, which includes the front cover page. The front page is highlighted on the magazine to attract art enthusiasts, photographers, or individuals that enjoy various body art. For tools and resources, I used Adobe InDesign software to complete this project. As for other contents used, one or more of the images on this magazine were reused from a common creative website, or licensed from Adobe stock photos.
4. Spooky Disco Flyer - CMST 310 - Fundamentals of Electronic Publishing, 2020
This assignment was part of project 1, for CMST 310’s Fundamental of Electronic Publishing. It was a requirement to create an event flyer, which included choosing the party theme, finding the appropriate images, typography, and colors for the event flyer. The theme that I decided to go for, is a Spooky Disco party, which is why I called it Spooky Disco. I wanted to convey this on my flyer, so naturally, I used colors that are slightly on the darker side. Then I combined and blended a few images with each other, giving it a smoky effect, and added some disco balls to bring out some brightness and fun that you’d usually get at a disco or dance party. More importantly, since spooky parties are more popular during Halloween, I added a couple of pumpkins to the flyer. One or more of the images on this magazine were reused from a common creative website, or licensed from Adobe’s stock photos.
5. Wedding Program - CMST 310 - Fundamentals of Electronic Publishing, 2020
This was an assignment that was part of project 3, for CMST 310’s Fundamental of Electronic Publishing. It was a requirement to create a wedding program from scratch. Specifically, a single-fold two-page document. It also had to be a double-sided wedding program using the newest version of Adobe InDesign. An example of the expected format was provided to us, along with the program content, and the wedding content. I searched online to find inspirational layouts, and an image through one of the creative common sites as part of the main image. I chose the typography and the use of colors according to the project description and project requirement.
6. Band Website - Killswitch Engage - CMST 386 - Principles of Web Design & Technology II, 2020
This was an assignment that was part of project 3, for CMST 385’s Principles of Web Design & Technology II. It was a requirement to create a music artist website utilizing the scripting languages of HTML and CSS, and various web elements. The page was designed for a clean and minimalist look, with text sections visually lifted from the page using neumorphic design. The headers and footers were locked on the page, moving with the user. The website also includes multiple pages, the music and news tab. On the main page, you’ll find general content of Killswitch Engage’s band information. The KsE news also included tour dates, and side projects. While the site’s music tab included a list of their newest album’s songs. The text editor that was used to create the website was visual studio code, and the various images that were used on the web page have been reused from Wikipedia. Though, they’re licensed as creative common images.
7. World News Cover - CMST 425 - Advanced Image Editing, 2020
The Weekly World News magazine cover was supposed to be done in the style of an old-time parody magazine, with clearly false news on it. Examples from the class were talking about conspiracy theories, and I wanted to take it in a more fun, supernatural theme. Being about black and white supernatural events, it made me think of the stories sailors would tell about sea monsters. I chose to use sea-themed creatures for my magazine cover. Using creative commons licensed media, I photoshopped together multiple pictures to create the mermaid, loch ness monster, and Cthulhu scenes. Topics for the story were chosen to be modern, trying to make the old mythical creatures have a contrast in concept to their story.
8. 3D Objective from a Photograph - CMST 425 - Advanced Image Editing, 2020
This was an assignment that was part of project 4, for CMST 425’s Advanced Image Editing. A major part of the assignment was to add a 3D phone to a photograph, matching the photo's perspective and adding appropriate lighting, reflection, material, and shadowing to make the phone appear to be an existing part of the photograph. Much like project 1, which is number 7 on this list, I feel like I really enjoyed putting this project together. Working out how to extrude depth onto a flat image and mix a shadow into a pre-existing photo while keeping the lighting consistent was a challenge, but I believe it came out as a realistic device. The software that I used to perform the previously mentioned tasks were done in Adobe Photoshop. The images that were used, I had purchased through Adobe Stock Photos licensing.
