{"id":201,"date":"2026-09-14T02:18:03","date_gmt":"2026-09-14T02:18:03","guid":{"rendered":"https:\/\/danforthportfolios.com\/ms1126775\/?page_id=201"},"modified":"2026-10-12T18:17:00","modified_gmt":"2026-10-12T18:17:00","slug":"graphic-design","status":"publish","type":"page","link":"https:\/\/danforthportfolios.com\/ms1126775\/graphic-design\/","title":{"rendered":"Skills Showcase"},"content":{"rendered":"

https:\/\/danforthportfolios.com\/ms1126775\/wp-content\/uploads\/sites\/214\/2026\/10\/V3.mp4<\/p>\n

The project was about a game environment. The idea was to build an entire composition that read as part of a real game. HUD, UI, subtle animation in the background, realistic assets, and mood.
I set out to create this loading screen with a background. The place would be in a dock, next to a boat, with a sunken building in the background, with cloudy, foggy weather, at dusk. The idea was to evoke a feeling of uncertainty.<\/p>\n

\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/p>\n

I first started drafting ideas, and drawing different compositions. I did the basic pre-production timeline most people use: Research, brainstorm, moodboard\u2026 I also decided on the software I was going to use for the project. I used Photoshop for the HUD\/UI creation; Blender for composition, 3D world building, lighting, and video. I finished the project in Premiere joining both the UI and video together. I also used it for color grading.<\/p>\n

This is for players of story-driven, atmospheric, exploration-driven games. People who enjoy spending time looking at the little things.\u00a0<\/p>\n

\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/p>\n

When I started to build the assets, I decided that the building had to be placed far, almost invisible because I wanted to drive this feeling of uncertainty for the player. \u201cWhat am I doing here?\u201d was the question I was looking for. \u201cWhat is that in the back?\u201d Those questions make the viewer have the desire to find out\u2026 Since it was placed far, there wasn\u2019t any need for making it high poly. A few clear shapes were enough for it to be seen as a building. <\/p>\n

But after a while of revision, I thought that the building felt off. There was no indicator of why it was there, no indicator that there ever was a city nearby that suffered any sort of damage for a building to have fallen into the ocean. So I decided to not use the asset. But the uncertainty aspect stayed intact. <\/p>\n

Lighting was also something that made a big difference. The first few 3D renders I had, the lighting was just there. It didn\u2019t change the mood of the environment. After all, it was just plain white. So in later stages, I changed it to yellow, and that really changed the environment. These little things that we think have no real impact in the scene are what really make it interesting. The thing is that warm colors are comforting. That is not what I wanted. So I changed the colors of the environment to this gradient between white, blue, and gray.\u00a0<\/p>\n

\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/p>\n

For the visual hierarchy, I did not want too much visual clutter, but I also wanted it to feel like an actual environment. So the boat became the main driver of the composition, and the rest of the world helped the boat become more interesting. The rain, fog, waves, dock, and birds, all contributed to that.\u00a0<\/p>\n

\u00a0<\/p>\n

The ocean was straightforward. First, an ocean modifier was used. Then it was just a matter of scaling it down, setting key frames, changing the choppiness for the water to not have big waves, lowering roughness, changing IOR, and choosing the right color.\u00a0<\/p>\n

The HUD\/UI were made in Photoshop. I had this first idea to use a game HUD with a health bar, items, and the menu. After reviewing it several times, I decided to scrap it completely. I figured I should do a separate animation of the title screen. I thought that was just cleaner, less full of information. It became MISSION III, DROWNED SILENCE, PRESS ANY BUTTON.<\/p>\n

\u00a0<\/p>\n

When compositing, I rendered from Blender 480 individual frames for higher quality. H-264 isn\u2019t a great option for rendering. Then in Premiere, I made an image sequence with these frames. I worked on the color as well. And then I added the UI Assets from photoshop. <\/p>\n

\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/p>\n

I faced quite a few challenges. When I started to build the assets, I didn\u2019t really know how hard and time-consuming it would be. I had done it before, but not in this scale, and time. So I had a few retries on specifically the boat. It was a major challenge getting the shape just right, and then shading it to look like it was wet. Hard-surface objects like the boat need a lot of beveling and careful shading to look right. Lowering the roughness is what finally made the boat look wet. During the later stages of rendering, I went through some issues as well. I rendered 480 individual 16 bit frames with a baked ocean that only went to 250 frames. And when I realized it, I also found other issues that made me render the full 480 all over again. <\/p>\n

If it was a team project, my role would have been to model, and animate the objects. My experience allows me to troubleshoot at a quicker pace, which keeps the team moving and allows for better results.<\/p>\n","protected":false},"excerpt":{"rendered":"

https:\/\/danforthportfolios.com\/ms1126775\/wp-content\/uploads\/sites\/214\/2026\/10\/V3.mp4 The project was about a game environment. The idea was to build an entire composition that read as part […]<\/p>\n","protected":false},"author":197,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-201","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/pages\/201","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/users\/197"}],"replies":[{"embeddable":true,"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/comments?post=201"}],"version-history":[{"count":8,"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/pages\/201\/revisions"}],"predecessor-version":[{"id":271,"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/pages\/201\/revisions\/271"}],"wp:attachment":[{"href":"https:\/\/danforthportfolios.com\/ms1126775\/wp-json\/wp\/v2\/media?parent=201"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}