{"id":1855,"date":"2024-08-01T15:46:23","date_gmt":"2024-08-01T15:46:23","guid":{"rendered":"https:\/\/ooko.com\/rick\/?post_type=project&p=1855"},"modified":"2024-08-05T17:32:51","modified_gmt":"2024-08-05T17:32:51","slug":"siccar-designer-new","status":"publish","type":"project","link":"https:\/\/ooko.com\/rick\/project\/siccar-designer-new\/","title":{"rendered":"Siccar Designer"},"content":{"rendered":"

[et_pb_section fb_built=”1″ _builder_version=”4.25.1″ _module_preset=”default” background_color=”#FFFFFF” background_image=”https:\/\/ooko.com\/rick\/wp-content\/uploads\/2024\/07\/designer_wireframes_banner.jpg” height=”40vh” max_height=”40vh” custom_margin=”||||false|false” custom_padding=”0px||0px||false|false” box_shadow_style=”preset6″ box_shadow_blur=”40px” box_shadow_spread=”20px” box_shadow_color=”rgba(0,0,0,0.5)” locked=”off” global_colors_info=”{}”][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.25.1″ _module_preset=”default” min_height=”100%” height=”100%” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.25.1″ _module_preset=”default” background_color=”rgba(10,10,10,0.5)” positioning=”absolute” position_origin_a=”bottom_right” custom_padding=”||0px||false|false” global_colors_info=”{}”][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.25.1″ _module_preset=”default” background_color=”#FFFFFF” positioning=”absolute” position_origin_a=”bottom_right” custom_padding=”||0px||false|false” global_colors_info=”{}”][et_pb_heading title=”Siccar Designer” _builder_version=”4.25.1″ _module_preset=”default” title_font=”|300|||||||” title_text_align=”left” title_text_color=”#FFFFFF” background_color=”#00A6BC” background_enable_image=”off” background_position=”top_center” custom_margin=”10px|10px|0px|10px|false|false” custom_padding=”20px|20px|10px|20px|false|false” global_colors_info=”{}”][\/et_pb_heading][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.25.1″ _module_preset=”default” background_color=”#FFFFFF” background_image=”https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ookocolourfade.jpg” height=”100vh” max_height=”100vh” locked=”off” global_colors_info=”{}”][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.25.1″ _module_preset=”default” custom_margin=”||||false|false” custom_padding=”0px||20px||false|false” border_width_bottom=”1px” border_style_bottom=”dotted” locked=”off” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ooko_back_off.png” alt=”back” title_text=”ooko_back_on” url=”https:\/\/ooko.com\/rick#portfolio” _builder_version=”4.25.1″ _module_preset=”default” width=”100px” custom_padding=”||||false|false” global_colors_info=”{}” src__hover_enabled=”on|hover” src__hover=”https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ooko_back_on.png”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.25.1″ _module_preset=”default” custom_padding=”|30px||30px|false|false” global_colors_info=”{}”][et_pb_text _builder_version=”4.25.1″ _module_preset=”default” text_font=”|300|||||||” text_text_color=”#333333″ global_colors_info=”{}”]<\/p>\n

Siccar – Designer – UI wireframes<\/p>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ make_equal=”on” _builder_version=”4.25.1″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.25.1″ _module_preset=”default” global_colors_info=”{}”]<\/p>\n

When I joined Siccar, their proof-of-concept flagship Designer software was functional albeit in a very primitive form.<\/p>\n

Initial testing with sympathetic users resulted in the feedback that in its current format, essentially a series of nested forms, it worked but looked basic, usability was poor and scalablity would be a problem.<\/p>\n

My primary role was to improve the UI and bring some design love to the app.<\/p>\n

The UI development went through a number of iterations, the different versions can be viewed by clicking through the the individual projects below…<\/p>\n

[\/et_pb_text][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.25.1″ _module_preset=”default” custom_padding=”|10px||10px|false|false” border_style_all=”dashed” global_colors_info=”{}”][dsm_icon_list icon_gap_width=”2em” list_space_between=”5px” _builder_version=”4.25.1″ _module_preset=”default” background_enable_color=”off” hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″][dsm_icon_list_child text=”UI Design” font_icon=”||fa||900″ icon_color=”#FFFFFF” icon_padding=”4px” _builder_version=”4.25.1″ _module_preset=”default” text_font=”|600|||||||” text_text_color=”#FFFFFF” background_color=”#FE3E8D” background_enable_color=”on” custom_padding=”5px||5px|10px|false|false” global_colors_info=”{}”][\/dsm_icon_list_child][dsm_icon_list_child text=”Edinburgh” font_icon=”||divi||400″ icon_color=”#FFFFFF” icon_padding=”3px” _builder_version=”4.25.1″ _module_preset=”default” text_font=”|600|||||||” text_text_color=”#FFFFFF” background_color=”#FFBC00″ background_enable_color=”on” custom_padding=”5px||5px|10px|false|false” global_colors_info=”{}”][\/dsm_icon_list_child][dsm_icon_list_child text=”2021 | 22 | 23″ font_icon=”||fa||400″ icon_color=”#FFFFFF” icon_padding=”4px” _builder_version=”4.25.1″ _module_preset=”default” text_font=”|600|||||||” text_text_color=”#FFFFFF” background_color=”#008605″ background_enable_color=”on” custom_padding=”5px||5px|10px|false|false” hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″][\/dsm_icon_list_child][dsm_icon_list_child text=”AdobeXD” font_icon=”||fa||900″ icon_color=”#FFFFFF” icon_padding=”2px” _builder_version=”4.25.1″ _module_preset=”default” text_font=”|600|||||||” text_text_color=”#FFFFFF” background_color=”#FF8A00″ background_enable_color=”on” custom_padding=”5px||5px|10px|false|false” global_colors_info=”{}”][\/dsm_icon_list_child][\/dsm_icon_list][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_gallery gallery_ids=”1873,1874,1875,1876″ fullwidth=”on” _builder_version=”4.25.1″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_gallery][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.20.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_portfolio fullwidth=”off” include_categories=”38″ show_categories=”off” _builder_version=”4.25.1″ _module_preset=”default” title_text_align=”center” title_font_size=”12px” title_letter_spacing=”3px” global_colors_info=”{}”][\/et_pb_portfolio][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"

Siccar – Designer – UI wireframesWhen I joined Siccar, their proof-of-concept flagship Designer software was functional albeit in a very primitive form. Initial testing with sympathetic users resulted in the feedback that in its current format, essentially a series of nested forms, it worked but looked basic, usability was poor and scalablity would be a […]<\/p>\n","protected":false},"author":1,"featured_media":1421,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"[et_pb_section fb_built=\"1\" _builder_version=\"4.25.1\" _module_preset=\"default\" background_color=\"#333333\" background_image=\"https:\/\/ooko.com\/rick\/wp-content\/uploads\/2024\/07\/contxt_banner.jpg\" height=\"25vh\" max_height=\"25vh\" custom_margin=\"||||false|false\" custom_padding=\"0px||0px||false|false\" box_shadow_style=\"preset6\" box_shadow_blur=\"40px\" box_shadow_spread=\"20px\" box_shadow_color=\"rgba(0,0,0,0.5)\" locked=\"off\" global_colors_info=\"{}\"][et_pb_row column_structure=\"3_5,2_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" min_height=\"100%\" height=\"100%\" global_colors_info=\"{}\"][et_pb_column type=\"3_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" background_color=\"rgba(10,10,10,0.5)\" positioning=\"absolute\" position_origin_a=\"bottom_right\" custom_padding=\"||0px||false|false\" global_colors_info=\"{}\"][\/et_pb_column][et_pb_column type=\"2_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" background_color=\"#FFFFFF\" positioning=\"absolute\" position_origin_a=\"bottom_right\" custom_padding=\"||0px||false|false\" global_colors_info=\"{}\"][et_pb_heading title=\"Contxt ID\" _builder_version=\"4.25.1\" _module_preset=\"default\" title_font=\"|300|||||||\" title_text_align=\"left\" title_text_color=\"#FFFFFF\" background_color=\"#00A6BC\" background_enable_image=\"off\" background_position=\"top_center\" custom_margin=\"10px|10px|0px|10px|false|false\" custom_padding=\"20px|20px|10px|20px|false|false\" global_colors_info=\"{}\"][\/et_pb_heading][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=\"1\" _builder_version=\"4.25.1\" _module_preset=\"default\" background_color=\"#FFFFFF\" background_image=\"https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ookocolourfade.jpg\" height=\"100vh\" max_height=\"100vh\" locked=\"off\" global_colors_info=\"{}\"][et_pb_row column_structure=\"3_5,2_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" custom_margin=\"||||false|false\" custom_padding=\"0px||20px||false|false\" border_width_bottom=\"1px\" border_style_bottom=\"dotted\" locked=\"off\" global_colors_info=\"{}\"][et_pb_column type=\"3_5\" _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_image src=\"https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ooko_back_off.png\" alt=\"back\" title_text=\"ooko_back_on\" url=\"https:\/\/ooko.com\/rick#portfolio\" _builder_version=\"4.25.1\" _module_preset=\"default\" width=\"100px\" custom_padding=\"||||false|false\" global_colors_info=\"{}\" src__hover_enabled=\"on|hover\" src__hover=\"https:\/\/ooko.com\/rick\/wp-content\/uploads\/2023\/03\/ooko_back_on.png\"][\/et_pb_image][\/et_pb_column][et_pb_column type=\"2_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" custom_padding=\"|30px||30px|false|false\" global_colors_info=\"{}\"][et_pb_text _builder_version=\"4.25.1\" _module_preset=\"default\" text_font=\"|300|||||||\" text_text_color=\"#333333\" global_colors_info=\"{}\"]

Contxt ID - DARKSPARK - UI wireframes<\/p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=\"3_5,2_5\" make_equal=\"on\" _builder_version=\"4.25.1\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_column type=\"3_5\" _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_text _builder_version=\"4.25.1\" _module_preset=\"default\" global_colors_info=\"{}\"]

Contxt ID were working on \"Darkspark\" - an API management app.<\/p>\n

Niall, their CTO, was familiar with my work with Siccar on the Siccar Hero Demo<\/a> and invited me to help with the Darkspark UI design.<\/p>\n

Over the course of a few months we collaborated to develop and refine a set of wireframes using AdobeXD that their tech team then translated to the live app.<\/p>[\/et_pb_text][\/et_pb_column][et_pb_column type=\"2_5\" _builder_version=\"4.25.1\" _module_preset=\"default\" custom_padding=\"|10px||10px|false|false\" border_style_all=\"dashed\" global_colors_info=\"{}\"][dsm_icon_list icon_gap_width=\"2em\" list_space_between=\"5px\" _builder_version=\"4.25.1\" _module_preset=\"default\" background_enable_color=\"off\" hover_enabled=\"0\" global_colors_info=\"{}\" sticky_enabled=\"0\"][dsm_icon_list_child text=\"UI Design\" font_icon=\"||fa||900\" icon_color=\"#FFFFFF\" icon_padding=\"4px\" _builder_version=\"4.25.1\" _module_preset=\"default\" text_font=\"|600|||||||\" text_text_color=\"#FFFFFF\" background_color=\"#FE3E8D\" background_enable_color=\"on\" custom_padding=\"5px||5px|10px|false|false\" hover_enabled=\"0\" global_colors_info=\"{}\" sticky_enabled=\"0\"][\/dsm_icon_list_child][dsm_icon_list_child text=\"Edinburgh\" font_icon=\"||divi||400\" icon_color=\"#FFFFFF\" icon_padding=\"3px\" _builder_version=\"4.25.1\" _module_preset=\"default\" text_font=\"|600|||||||\" text_text_color=\"#FFFFFF\" background_color=\"#FFBC00\" background_enable_color=\"on\" custom_padding=\"5px||5px|10px|false|false\" global_colors_info=\"{}\"][\/dsm_icon_list_child][dsm_icon_list_child text=\"2022 \/ 23\" font_icon=\"||fa||400\" icon_color=\"#FFFFFF\" icon_padding=\"4px\" _builder_version=\"4.25.1\" _module_preset=\"default\" text_font=\"|600|||||||\" text_text_color=\"#FFFFFF\" background_color=\"#008605\" background_enable_color=\"on\" custom_padding=\"5px||5px|10px|false|false\" global_colors_info=\"{}\"][\/dsm_icon_list_child][dsm_icon_list_child text=\"AdobeXD\" font_icon=\"||fa||900\" icon_color=\"#FFFFFF\" icon_padding=\"2px\" _builder_version=\"4.25.1\" _module_preset=\"default\" text_font=\"|600|||||||\" text_text_color=\"#FFFFFF\" background_color=\"#FF8A00\" background_enable_color=\"on\" custom_padding=\"5px||5px|10px|false|false\" global_colors_info=\"{}\"][\/dsm_icon_list_child][\/dsm_icon_list][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_column type=\"4_4\" _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_image src=\"https:\/\/ooko.com\/rick\/wp-content\/uploads\/2024\/06\/contxt_wireframes.png\" title_text=\"CONTXT WIREFRAMES\" _builder_version=\"4.25.1\" _module_preset=\"default\" border_width_all=\"1px\" box_shadow_style=\"preset3\" global_colors_info=\"{}\"][\/et_pb_image][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_column type=\"4_4\" _builder_version=\"4.20.2\" _module_preset=\"default\" global_colors_info=\"{}\"][et_pb_gallery gallery_ids=\"1640,1641,1630,1631,1632,1633,1634,1635,1636,1642,1629,1639,1637,1638\" posts_number=\"8\" zoom_icon_color=\"#333333\" _builder_version=\"4.25.1\" _module_preset=\"default\" title_font=\"|300|||||||\" title_text_align=\"center\" title_font_size=\"12px\" title_letter_spacing=\"1px\" title_line_height=\"1.5em\" global_colors_info=\"{}\"][\/et_pb_gallery][\/et_pb_column][\/et_pb_row][\/et_pb_section]","_et_gb_content_width":"","footnotes":""},"project_category":[37,33],"project_tag":[],"class_list":["post-1855","project","type-project","status-publish","has-post-thumbnail","hentry","project_category-siccar","project_category-ui"],"_links":{"self":[{"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project\/1855","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project"}],"about":[{"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/types\/project"}],"author":[{"embeddable":true,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/comments?post=1855"}],"version-history":[{"count":16,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project\/1855\/revisions"}],"predecessor-version":[{"id":2110,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project\/1855\/revisions\/2110"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/media\/1421"}],"wp:attachment":[{"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/media?parent=1855"}],"wp:term":[{"taxonomy":"project_category","embeddable":true,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project_category?post=1855"},{"taxonomy":"project_tag","embeddable":true,"href":"https:\/\/ooko.com\/rick\/wp-json\/wp\/v2\/project_tag?post=1855"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}