{"id":111,"date":"2024-07-08T02:48:43","date_gmt":"2024-07-07T14:48:43","guid":{"rendered":"https:\/\/derena.info\/?page_id=111"},"modified":"2026-08-10T22:09:39","modified_gmt":"2026-08-10T10:09:39","slug":"financial-charts-split","status":"publish","type":"page","link":"https:\/\/oderena.com\/?page_id=111","title":{"rendered":"Supporting Split View in Financial Charts"},"content":{"rendered":"\n<h5 class=\"wp-block-heading\">Project was part of identifying opportunity for enhancing UX of IG Trading Financial Charting package.<\/h5>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image alignfull size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"341\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-1024x341.png\" alt=\"\" class=\"wp-image-469\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-1024x341.png 1024w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-300x100.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-768x255.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-1536x511.png 1536w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-hero-image-2048x681.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Problem statement<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Clients wanted to viewing chart on different timeframes\/intervals to analyse market and define trends and patterns.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Challenge<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Charting is heavy package and there were tech limitations on amount of streaming charts without not overloading web platform.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">Process and first results<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Defined requirements<\/strong> with stakeholders and technical team to ensure a comprehensive understanding of user needs, effective problem-solving, and successful implementation.<\/li>\n\n\n\n<li><strong>Gathered insights<\/strong> from usability sessions and from competitor research.<\/li>\n\n\n\n<li><strong>Identified<\/strong> the most useful chart view combinations and tested with dev team on chart load<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"2\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-1024x2.png\" alt=\"\" class=\"wp-image-423\" style=\"width:10240px;height:auto\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-1024x2.png 1024w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-300x1.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-768x1.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-1536x3.png 1536w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/divider-2048x4.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">In further platform user testing we have discovered that this feature had poor discoverability<\/p>\n\n\n\n<figure class=\"wp-block-image alignwide size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"77\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-1024x77.png\" alt=\"\" class=\"wp-image-424\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-1024x77.png 1024w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-300x23.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-768x58.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-1536x115.png 1536w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-split-img-1-2048x154.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Challenge<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">How to educate users on platform interface without explaining each feature and tool.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Hypothesis<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The visibility and styling of the button is the main issue.<\/li>\n\n\n\n<li>There are other tools might be missed by clients.<\/li>\n<\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Results and improvements<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>I have created designs where more <strong>frequently used chart menu <\/strong>items moved from dropdown and <strong>placed on the top of chart<\/strong>.<\/li>\n\n\n\n<li><strong>Added tooltips<\/strong> to chart tools buttons\/icons to help users understand what tool is without guessing the icon.<\/li>\n\n\n\n<li>I looked at redesign the <strong>icon \/ button to look more interactive<\/strong>.<\/li>\n\n\n\n<li>We have asked <strong>internal<\/strong> <strong>analysts to use split chart<\/strong> feature in the materials they are publishing as an additional advertising of the tool<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-f56f613f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/oderena.com\/?page_id=105\">\u2190 Previous project<\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"has-text-align-right wp-block-paragraph\"><\/p>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Project was part of identifying opportunity for enhancing UX of IG Trading Financial Charting package. Problem statement Clients wanted to viewing chart on different timeframes\/intervals to analyse market and define trends and patterns. Challenge Charting is heavy package and there were tech limitations on amount of streaming charts without not overloading web platform. Process and [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":199,"menu_order":10,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-111","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/111","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/oderena.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=111"}],"version-history":[{"count":14,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/111\/revisions"}],"predecessor-version":[{"id":471,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/111\/revisions\/471"}],"up":[{"embeddable":true,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/199"}],"wp:attachment":[{"href":"https:\/\/oderena.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=111"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}