{"id":253565,"date":"2025-02-18T13:49:02","date_gmt":"2025-02-18T13:49:02","guid":{"rendered":"https:\/\/sophiacatherine.org\/?post_type=project&p=253565"},"modified":"2025-07-22T21:24:45","modified_gmt":"2025-07-22T20:24:45","slug":"ocean-shore","status":"publish","type":"project","link":"https:\/\/sophiacatherine.org\/index.php\/project\/ocean-shore\/","title":{"rendered":"Ocean Shore"},"content":{"rendered":"

[et_pb_section fb_built=”1″ make_equal=”on” specialty=”on” background_color_1=”#B09FC7″ padding_top_1=”10px” padding_top_2=”6vw” padding_right_1=”20px” padding_bottom_1=”10px” padding_bottom_2=”6vw” padding_left_1=”20px” padding_left_2=”80px” padding_top_bottom_link_1=”true” padding_top_bottom_link_2=”true” padding_left_right_link_1=”true” padding_left_right_link_2=”false” padding_2_tablet=”0px|0px||0px|false|true” padding_2_phone=”” padding_2_last_edited=”on|tablet” admin_label=”About” _builder_version=”4.27.4″ z_index=”10″ custom_padding=”0px||0px|||” global_colors_info=”{}”][et_pb_column type=”1_4″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.27.4″ text_font=”Urbanist|700||on|||||” text_font_size=”150px” text_letter_spacing=”-11px” text_line_height=”1.1em” transform_scale_tablet=”” transform_scale_phone=”” transform_scale_last_edited=”on|tablet” transform_translate=”-32%|190%” transform_translate_tablet=”0%|0%” transform_translate_phone=”” transform_translate_last_edited=”on|tablet” transform_translate_linked=”off” transform_rotate=”0deg|0deg|-90deg” transform_rotate_tablet=”0deg|0deg|0deg” transform_rotate_phone=”” transform_rotate_last_edited=”on|desktop” transform_skew_tablet=”” transform_skew_phone=”” transform_skew_last_edited=”on|desktop” transform_origin_tablet=”” transform_origin_phone=”” transform_origin_last_edited=”on|desktop” transform_styles_last_edited=”on|tablet” text_orientation=”center” background_layout=”dark” width=”500%” width_tablet=”100%” width_phone=”” width_last_edited=”on|tablet” text_font_size_tablet=”20px” text_font_size_phone=”” text_font_size_last_edited=”on|phone” text_letter_spacing_tablet=”-1px” text_letter_spacing_phone=”-1px” text_letter_spacing_last_edited=”on|desktop” text_line_height_tablet=”0.9em” text_line_height_phone=”0.9em” text_line_height_last_edited=”on|phone” transform_styles_tablet=”” transform_styles_phone=”” text_orientation_tablet=”left” text_orientation_phone=”” text_orientation_last_edited=”on|tablet” global_colors_info=”{}” transform_styles__hover_enabled=”off|desktop” transform_scale__hover_enabled=”off|desktop” transform_translate__hover_enabled=”off|desktop” transform_rotate__hover_enabled=”off|desktop” transform_skew__hover_enabled=”off|desktop” transform_origin__hover_enabled=”off|desktop” text_font_size__hover_enabled=”off|desktop”]<\/p>\n

Overview<\/p>\n

[\/et_pb_text][\/et_pb_column][et_pb_column type=”3_4″ specialty_columns=”3″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_row_inner _builder_version=”4.16″ global_colors_info=”{}”][et_pb_column_inner saved_specialty_column_type=”3_4″ _builder_version=”4.16″ global_colors_info=”{}”][et_pb_text _builder_version=”4.27.4″ header_2_font=”Urbanist|700||on|||||” header_2_text_color=”#261A39″ header_2_font_size=”12px” header_2_letter_spacing=”2px” custom_margin=”||10px||false|false” header_2_font_size_tablet=”10px” header_2_font_size_phone=”9px” header_2_font_size_last_edited=”on|phone” locked=”off” global_colors_info=”{}”]<\/p>\n

\u2014<\/span> Project Statement<\/h2>\n

[\/et_pb_text][et_pb_text _builder_version=”4.27.4″ header_2_font=”Dancing Script|700|||||||” header_2_font_size=”70px” header_2_line_height=”1.1em” header_2_text_align_tablet=”left” header_2_text_align_phone=”left” header_2_text_align_last_edited=”on|phone” header_2_font_size_tablet=”50px” header_2_font_size_phone=”50px” header_2_font_size_last_edited=”on|tablet” locked=”off” global_colors_info=”{}”]<\/p>\n

Ocean Shore<\/h2>\n

[\/et_pb_text][et_pb_text _builder_version=”4.27.4″ text_font=”Urbanist||||||||” text_text_color=”#676879″ text_font_size=”18px” text_line_height=”2em” link_font=”||||on||||” link_text_color=”#fc3f3f” text_font_size_tablet=”15px” text_font_size_phone=”14px” text_font_size_last_edited=”on|phone” locked=”off” global_colors_info=”{}”]<\/p>\n

Ocean Shore, located outside of Seattle, WA, is a cherished amusement park delivering family fun to visitors of all ages for five decades. The application contains a complete icon design, logotype creation, interface development, and user testing. Beginning with the initial phase of thumbnail sketches to conceptualize icons, a logotype and wireframes quickly developed. User testing was crucial in refining these elements, ensuring their effectiveness and user-friendliness.<\/p>\n

The application\u2019s visual identity draws from a color palette of white, yellow, green, and two shades of brown, evoking the ocean and resonating with family, rejuvenation, and warmth, while two complementary typefaces, Parisine Plus Std Clair (sans serif) and Parkside (script), balance hierarchy within the interface.<\/p>\n

The Ocean Shore imagery features a blend of seaside eateries, thrilling roller coasters, and scenes of couples and families enjoying their day at the park.<\/p>\n

Twelve interactive screens make up the Ocean Shore interface, designed to provide a delightful user experience and real-time data, showcasing features such as coaster wait times and restaurant ticket purchases, and a set of icons aids navigation and interaction.<\/p>\n

[\/et_pb_text][\/et_pb_column_inner][\/et_pb_row_inner][\/et_pb_column][\/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Images” _builder_version=”4.16″ custom_padding=”0px|||||” global_colors_info=”{}”][et_pb_row column_structure=”1_3,2_3″ _builder_version=”4.27.4″ custom_padding=”0px|||||” global_colors_info=”{}”][et_pb_column type=”1_3″ _builder_version=”4.16″ z_index=”10″ global_colors_info=”{}”][et_pb_image src=”https:\/\/sophiacatherine.org\/wp-content\/uploads\/2025\/02\/OceanShore-Mockup-Sized-1.png” alt=”Phone with onboarding screen for Ocean Shore Application on the beach” title_text=”Ocean Shore Boardwalk Mockup” _builder_version=”4.27.4″ background_color=”RGBA(255,255,255,0)” custom_margin=”|-140px|||false|false” custom_margin_tablet=”|0px|||false|false” custom_margin_phone=”” custom_margin_last_edited=”on|tablet” border_color_all=”#ffffff” border_width_right=”30px” border_width_bottom=”30px” border_width_right_tablet=”0px” border_width_right_phone=”” border_width_right_last_edited=”on|tablet” border_width_bottom_tablet=”0px” border_width_bottom_phone=”” border_width_bottom_last_edited=”on|tablet” global_colors_info=”{}”][\/et_pb_image][et_pb_button button_url=”#process” button_text=”View the Process” button_alignment=”left” disabled_on=”on|on|off” _builder_version=”4.27.4″ _module_preset=”f05bba5e-c4ed-4d16-99f6-de883c2b94d5″ custom_button=”on” button_text_size=”14px” button_text_color=”#261A39″ button_bg_color=”#E1D6F2″ button_border_width=”4px” button_border_color=”RGBA(255,255,255,0)” button_border_radius=”20px” button_letter_spacing=”2px” button_font=”Urbanist|600|||||||” button_icon=”C||divi||400″ custom_padding=”16px|22px|16px|22px|true|true” box_shadow_style=”preset2″ locked=”off” global_colors_info=”{}” button_text_color__hover_enabled=”on|desktop” button_bg_color__hover_enabled=”on|desktop” button_bg_color__hover=”#B09FC7″ button_bg_enable_color__hover=”on” button_text_color__hover=”#FFFFFF”][\/et_pb_button][\/et_pb_column][et_pb_column type=”2_3″ _builder_version=”4.16″ global_colors_info=”{}”][et_pb_image src=”https:\/\/sophiacatherine.org\/wp-content\/uploads\/2025\/02\/Ocean-Mockup-Beach.png” title_text=”Ocean-Mockup-Beach” _builder_version=”4.27.4″ custom_margin=”40px|||-100px|false|false” custom_margin_tablet=”0px|||0px|false|false” custom_margin_phone=”” custom_margin_last_edited=”on|tablet” locked=”off” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][\/et_pb_row][et_pb_row disabled_on=”off|off|off” _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.27.4″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.27.4″ header_2_font=”Urbanist|700||on|||||” header_2_text_color=”#261A39″ header_2_font_size=”12px” header_2_letter_spacing=”2px” custom_margin=”||10px||false|false” header_2_font_size_tablet=”10px” header_2_font_size_phone=”9px” header_2_font_size_last_edited=”on|phone” locked=”off” global_colors_info=”{}”]<\/p>\n

\u2014<\/span> Color & Type Studies<\/h2>\n

[\/et_pb_text][et_pb_code _builder_version=”4.27.4″ _module_preset=”default” custom_margin_tablet=”” custom_margin_phone=”25px||||false|false” custom_margin_last_edited=”on|tablet” custom_css_free_form=”.swatch-container {|| display: flex;|| justify-content: center;|| align-items: center;|| gap: 20px;|| flex-wrap: wrap;|| max-width: 600px;|| margin: 0 auto; \/* Ensures centering *\/||}||||.swatch-wrapper {|| position: relative;|| display: flex;|| flex-direction: column;|| align-items: center;||}||||.swatch {|| width: 90px;|| height: 90px;|| border-radius: 50%;|| cursor: pointer;|| transition: transform 0.3s ease, box-shadow 0.3s ease;||}||||.swatch:hover {|| transform: scale(1.1);|| box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);||}||||.color-info {|| position: absolute;|| bottom: -70px;|| left: 50%;|| transform: translateX(-50%);|| text-align: center;|| font-size: 14px;|| background: rgba(255, 255, 255, 0.95);|| padding: 10px;|| border-radius: 8px;|| box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);|| opacity: 0;|| transition: opacity 0.3s ease, transform 0.3s ease;|| width: 220px;|| pointer-events: none;||}||||.swatch-wrapper:hover .color-info {|| opacity: 1;|| transform: translateX(-50%) translateY(5px);||}||||\/* Responsive Styles *\/||@media screen and (min-width: 769px) {|| .swatch-container {|| max-width: 600px; \/* Match the original max width *\/|| display: grid;|| grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); \/* Auto-fit based on swatch size *\/|| gap: 10px; \/* Reduce space between swatches *\/|| justify-content: center;|| }||}||||@media screen and (max-width: 768px) {|| .swatch-container {|| display: flex;|| max-width: 100%;|| justify-content: center;|| }|||| .swatch {|| width: 75px;|| height: 75px;|| }|||| .color-info {|| font-size: 12px;|| width: 180px;|| }||}||||@media screen and (max-width: 480px) {|| .swatch-container {|| gap: 15px;|| }|||| .swatch {|| width: 60px;|| height: 60px;|| }|||| .color-info {|| font-size: 11px;|| width: 150px;|| }||}” global_colors_info=”{}”]<\/p>\n

<\/p>\n
<\/p>\n
data-color=”Bay Leaf” data-cmyk=”51, 24, 40, 1″ data-rgb=”132, 164, 154″ data-hex=”#84a49a”><\/div>\n

<\/div>\n

<\/p>\n

<\/p>\n
data-color=”Albescent Yellow” data-cmyk=”4, 10, 18, 0″ data-rgb=”242, 225, 206″ data-hex=”#f2e1ce”><\/div>\n

<\/div>\n

<\/p>\n

<\/p>\n
data-color=”Ash Gray” data-cmyk=”3, 7, 13, 25″ data-rgb=”192, 184, 174″ data-hex=”#c0b8ae”><\/div>\n

<\/div>\n

<\/p>\n

<\/p>\n
data-color=”Seashell” data-cmyk=”4, 2, 2, 0″ data-rgb=”241, 243, 244″ data-hex=”#f1f3f4″><\/div>\n

<\/div>\n

<\/p>\n

<\/p>\n
data-color=”Cocoa” data-cmyk=”38, 55, 77, 21″ data-rgb=”139, 103, 68″ data-hex=”#8b6744″><\/div>\n

<\/div>\n

<\/div>\n

<\/p>\n

<\/div>\n