{"id":122,"date":"2024-07-08T03:27:23","date_gmt":"2024-07-07T15:27:23","guid":{"rendered":"https:\/\/derena.info\/?page_id=122"},"modified":"2026-08-10T22:01:51","modified_gmt":"2026-08-10T10:01:51","slug":"financial-charts","status":"publish","type":"page","link":"https:\/\/oderena.com\/?page_id=122","title":{"rendered":"Designing Financial Charts for Professional Traders"},"content":{"rendered":"\n<h5 class=\"wp-block-heading\">Financial charts were <strong>one of the most critical experiences<\/strong> within IG&#8217;s trading platform, helping traders analyse markets and make informed trading decisions.<br>Over <strong>9 years<\/strong>, I shaped the evolution of the charting experience across web, iOS and Android &#8211; from defining long-term product vision to designing new analytical tools, interaction patterns and scalable design standards.<\/h5>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9f35083ca25&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9f35083ca25\" class=\"wp-block-image alignfull size-large wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"327\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-1024x327.png\" alt=\"\" class=\"wp-image-401\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-1024x327.png 1024w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-300x96.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-768x245.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-1536x491.png 1536w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-hero-image-2048x654.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/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\">My role<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">I owned the design direction of Financial Charts, working closely with Product, Engineering, analysts and regional stakeholders.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>My responsibilities included<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Defining the long-term product vision <\/li>\n\n\n\n<li>Designing new chart analysis tools and interactions Improving usability across web and mobile <\/li>\n\n\n\n<li>Aligning the experience through reusable patterns and design guidelines <\/li>\n\n\n\n<li>Translating complex trading requirements into intuitive workflows<\/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\">Design approach<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Every improvement was grounded in user needs and business priorities. <strong>To identify opportunities, I combined:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Customer research <\/li>\n\n\n\n<li>Product analytics <\/li>\n\n\n\n<li>Customer support insights <\/li>\n\n\n\n<li>Competitive analysis <\/li>\n\n\n\n<li>HCI methodology <\/li>\n\n\n\n<li>Workshops with regional teams and market analysts<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">This continuous discovery process informed both incremental improvements and the long-term product vision.<\/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<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\">Key outcomes<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Over multiple releases I helped evolve Financial Charts into a more powerful and intuitive analysis tool by:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Improving chart interactions and usability <\/li>\n\n\n\n<li>Introducing advanced drawing and indicator capabilities <\/li>\n\n\n\n<li>Creating a scalable style guide for charts and data visualisation <\/li>\n\n\n\n<li>Establishing reusable UI patterns across analysis tools <\/li>\n\n\n\n<li>Supporting both novice and professional traders with flexible chart customisation<\/li>\n<\/ul>\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\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\"><strong>Indicator &amp; Drawing Settings<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Simplified configuration through a unified editing experience, colour management and reusable controls.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9f35083d91b&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9f35083d91b\" class=\"wp-block-image size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"701\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-1.png\" alt=\"\" class=\"wp-image-402\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-1.png 980w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-1-300x215.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-1-768x549.png 768w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:32px\" 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:33.33%\">\n<p class=\"wp-block-paragraph\"><strong>Financial Charts Design System<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Created reusable principles and components to ensure consistency across charting features.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9f35083df26&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9f35083df26\" class=\"wp-block-image size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"2080\" height=\"2135\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3.png\" alt=\"\" class=\"wp-image-405\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3.png 2080w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3-292x300.png 292w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3-998x1024.png 998w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3-768x788.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3-1496x1536.png 1496w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-3-1995x2048.png 1995w\" sizes=\"auto, (max-width: 2080px) 100vw, 2080px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:32px\" 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\">Business impact<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Financial Charts became one of IG&#8217;s flagship product experiences, frequently featured across product launches, marketing materials and educational content. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The charting experience played a key role in demonstrating IG&#8217;s analytical capabilities and supporting traders throughout the research and trading journey.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9f35083e576&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9f35083e576\" class=\"wp-block-image size-large wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"770\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-1024x770.png\" alt=\"\" class=\"wp-image-406\" srcset=\"https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-1024x770.png 1024w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-300x226.png 300w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-768x578.png 768w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-1536x1156.png 1536w, https:\/\/oderena.com\/wp-content\/uploads\/2026\/08\/Charts-img-4-2048x1541.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\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=130\">\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\"><a href=\"https:\/\/oderena.com\/?page_id=140\">Next project \u2192<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Financial charts were one of the most critical experiences within IG&#8217;s trading platform, helping traders analyse markets and make informed trading decisions.Over 9 years, I shaped the evolution of the charting experience across web, iOS and Android &#8211; from defining long-term product vision to designing new analytical tools, interaction patterns and scalable design standards. My [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":199,"menu_order":7,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-122","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/122","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=122"}],"version-history":[{"count":9,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/122\/revisions"}],"predecessor-version":[{"id":467,"href":"https:\/\/oderena.com\/index.php?rest_route=\/wp\/v2\/pages\/122\/revisions\/467"}],"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=122"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}