{"id":22189,"date":"2021-03-09T07:30:56","date_gmt":"2021-03-09T07:30:56","guid":{"rendered":"https:\/\/codeandpepper.com\/?p=22189"},"modified":"2022-05-27T11:39:28","modified_gmt":"2022-05-27T11:39:28","slug":"storytelling-with-data-5-steps-to-create-an-in-app-data-visualization","status":"publish","type":"post","link":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/","title":{"rendered":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization"},"content":{"rendered":"\n<p>Unless it\u2019s about counting money on our bank account, then for many of us, numbers are hard to remember and boring. We need a context and a good reason to process them. Not to mention making something useful out of it. The same goes for FinTech users. What if you could help them through <strong>storytelling<\/strong>?<\/p>\n\n\n\n<!--more-->\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\" alt=\"Storytelling with data: examples &amp; summary\n\" class=\"wp-image-22914\" width=\"864\" height=\"450\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-300x156.jpg 300w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-768x400.jpg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-361x188.jpg 361w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-192x100.jpg 192w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-720x375.jpg 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-432x225.jpg 432w\" sizes=\"auto, (max-width: 864px) 100vw, 864px\" \/><\/figure><\/div>\n\n\n\n<p><strong>Bringing data to life with good storytelling is not only possible but necessary<\/strong>. People want to manage their personal finance \u2013 put money into an account, withdraw, borrow, sometimes even invest. Money flows and their dynamics are useful only to those who can make connections between how much they are making, how much they spend, and how to make more.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-benefits-of-storytelling-with-data\"><strong>Benefits of storytelling with data<\/strong><\/h2>\n\n\n\n<p>Communication always goes both ways. When implemented, <strong>FinTech storytelling<\/strong> can be useful for both: application users and its owners. Advantages cover:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><b>Easy memorizing and processing of financial information<\/b>. Since raw data is linked to a meaning (often an emotional one) it\u2019s easier to connect numbers to real-life, personal examples. Data has context, can be understood and shared with friends, other family members, etc.<br><\/li><li><b>Increased trust for the company behind the application<\/b>. When it comes to money, people tend to be critical and cautious. Choosing the right FinTech app can be difficult, there are a lot of them. Explaining what the app does and how users can work around concrete numbers, increases transparency, and builds a relationship. It\u2019s important especially for the software-as-a-service (SaaS) business model.<br><\/li><li><b>Long<\/b>&#8211;<b>term customer relationship<\/b>. Storytelling with data builds an emotional connection with your brand. Customers identify the company behind the app and the app itself with positive emotions, practical use for the app. They perceive the product as an everyday necessity. Something they understand and value. The product becomes an experience.<br><\/li><li><b>Lower costs of customer retention<\/b>. Customers pay for products; loyal customers create communities around them. Good examples come from the&nbsp;<a href=\"https:\/\/codeandpepper.com\/the-future-of-insurtech\" target=\"_blank\" rel=\"noreferrer noopener\">InsurTech sector<\/a>, where information serves as a lever for turning users into engaged product ambassadors.<br><\/li><li><b>Increased market reach<\/b>. If you have a product, you have to invest in marketing. If you have a story, you got the potential to naturally \u201cinfect\u201d people with your messaging. Nobody cares about a product. People care about useful applications. Everybody cares about a good story. Real-life examples and marketing-tailored messaging can reduce user acquisition costs and increase market reach by word-of-mouth.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-story-words-images\"><strong>Story = words + images<\/strong><\/h2>\n\n\n\n<p>You can either use words alone or support them with images and animations. The most successful thing would be to use both. Visualizing data through simple images, coupled with marketing microcopy, engages the user.<\/p>\n\n\n\n<p>Removing clutter surrounding data should be done through adoption or creation of the right <a href=\"https:\/\/codeandpepper.com\/what-is-a-design-system-in-ux-and-why-it-is-important-to-have-one\" target=\"_blank\" rel=\"noreferrer noopener\">design system<\/a>. That way you can use the correct user experience and user interface (UX\/UI) <a href=\"https:\/\/codeandpepper.com\/what-are-the-design-principles-in-ui-ux-in-fintech\" target=\"_blank\" rel=\"noreferrer noopener\">design principles<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-bringing-data-to-life-with-good-storytelling\"><strong>Bringing data to life with good storytelling<\/strong><\/h2>\n\n\n\n<p>There is a phenomenon called \u201cthe last mile in analytics\u201d.&nbsp;<a href=\"https:\/\/visit.figure-eight.com\/rs\/416-ZBE-142\/images\/CrowdFlower_DataScienceReport_2016.pdf\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">According to CrowdFlower<\/a>, data scientists and marketers spend around 60% of their time cleaning and organizing information. 19% of their time is swallowed by collecting data sets. In total, a staggering 80% of their time is eaten by preparing and managing data for analysis. Mining data for patterns, which should be the most important part of the process, takes only 9% of the time.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02.jpg\" alt=\"Bringing data to life with good storytelling - analytics process\" class=\"wp-image-22937\" width=\"1000\" height=\"412\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02.jpg 1000w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-300x124.jpg 300w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-768x316.jpg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-361x149.jpg 361w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-200x82.jpg 200w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-720x297.jpg 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-864x356.jpg 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data-02-432x178.jpg 432w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/figure><\/div>\n\n\n\n<p>If it\u2019s so complicated for professionals, don\u2019t expect average users to be moved by numbers. The famous \u201clast mile\u201d is data deployment, which means delivering information + recommendations to the people that matter. In this case, to users. A big success of the FinTech industry comes from personalization and creating experiences. To display data properly and give the user some feedback, you need to prepare first.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-5-steps-for-successful-data-usage\"><strong>5 steps for successful data usage<\/strong><\/h3>\n\n\n\n<p><b>There are some steps you need to take on your journey in storytelling with data<\/b>. They will help you establish the right strategy and prepare engaging stories.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><b>Create a customer segmentation based on customers\u2019 profiles<\/b>. Take into account factors like monthly income, spending, historical money flows (at least 3-6 months), etc.<br><\/li><li><b>Identify main channels of users\u2019 transactions<\/b> (debit or credit cards, ATMs, online).<br><\/li><li><b>Analyze data towards spending\/investing habits and personalize the experience<\/b> with new offerings and stories to go with them.<br><\/li><li><b>Visualize personalized data for every single user<\/b>. Draw from statistics, in-app behavior, and create visual content that helps people make accurate financial decisions. Fuel visuals with a copy for better results.<br><\/li><li><b>Prepare plans for cross-selling and upselling<\/b>. They should be based on previously created customer profiles and analyzed behavior.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-examples-of-storytelling-with-data\"><strong>Examples of storytelling with data<\/strong><\/h2>\n\n\n\n<p>FinTech\u2019s global success is largely based on something unspoken. It\u2019s called&nbsp;<b>\u201cquantified self\u201d (QS)<\/b>. It\u2019s a term coined in 2007 by Gary Wolf and Kevin Kelly. It\u2019s about gaining knowledge through self-tracking. Do I have a problem with spending too much money on clothes? Could I spend in a nearby shop two times a month instead of two times a week and gain discounts and bonuses? FinTech apps help with that.<\/p>\n\n\n\n<p>There are companies that put many thoughts into showing users the future value of their investments. Like&nbsp;<a href=\"https:\/\/www.acorns.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Acorns<\/a>, which puts data to work in a clever way. Instead of displaying chunks of data, it breaks it into smaller pieces and showing the user how they are doing. Progress on spending, progress on saving\u2019 everything has its place.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-1024x576.jpg\" alt=\"Storytelling with data examples - Acorns\" class=\"wp-image-22190\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-1024x576.jpg 1024w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-300x169.jpg 300w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-768x432.jpg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-1536x864.jpg 1536w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-361x203.jpg 361w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-178x100.jpg 178w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-720x405.jpg 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-864x486.jpg 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns-432x243.jpg 432w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/acorns.jpg 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div>\n\n\n\n<p>There\u2019s also&nbsp;<a href=\"https:\/\/www.wealthfront.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Wealthfront<\/a>. It\u2019s all-around digital banking, borrowing, and investing app. It covers major topics of personal finance, showing customers their habits and allowing them to modify their financial projections. By seeing goals on the horizon, users have a compelling reason to stick to the app and invest with it.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront.png\" alt=\"Wealthfront - storytelling with data examples\" class=\"wp-image-22191\" width=\"802\" height=\"450\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront.png 900w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-300x169.png 300w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-768x432.png 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-361x203.png 361w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-178x100.png 178w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-720x405.png 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-864x486.png 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/wealthfront-432x243.png 432w\" sizes=\"auto, (max-width: 802px) 100vw, 802px\" \/><\/figure><\/div>\n\n\n\n<p>And what about&nbsp;<a href=\"https:\/\/www.stockpile.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Stockpile<\/a>? It\u2019s a brilliant example of how to talk about data by\u2026 removing it. At least at first. The app lets beginners invest in stocks. People find the stock market intimidating and confusing. Stockpile is removing all unnecessary pressure. The user chooses a sector (for example tech, fashion, gaming). Then the app displays a list of eligible companies. Next, the user gets information about share value, price, and trends (going up or down). And that\u2019s it.<\/p>\n\n\n\n<p>Where\u2019s the story? In context. The app has a learning section, where people can learn absolute basics. What is the stock? What should I buy? Where to start? Even a growth calculator brings people on a journey. Users can invest with even 5 dollars, and there\u2019s an option for creating a custodial account for minors.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"422\" height=\"750\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile.jpg\" alt=\"Steps in storytelling with data - Stockpile\" class=\"wp-image-22192\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile.jpg 422w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile-169x300.jpg 169w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile-118x209.jpg 118w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile-56x100.jpg 56w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/01\/stockpile-394x700.jpg 394w\" sizes=\"auto, (max-width: 422px) 100vw, 422px\" \/><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-summary\"><strong>Summary<\/strong><\/h2>\n\n\n\n<p>The BFSI (banking, financial services, and insurance) industry can benefit from data as much as their customers. By putting an application\u2019s user in the center of business processes, they can establish an end-goal in mind.&nbsp;<a href=\"https:\/\/www.mckinsey.com\/business-functions\/mckinsey-analytics\/our-insights\/breaking-away-the-secrets-to-scaling-analytics\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">In a short, excellent article by McKinsey<\/a>&nbsp;experts are saying:<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>companies should start by identifying the decision-making processes they could improve to generate additional value in the context of the company\u2019s business strategy and then work backward to determine what type of data insights are required to influence these decisions and how the company can supply them<\/p><\/blockquote>\n\n\n\n<p>A mouthful, so let\u2019s simplify it a little bit. If you can identify a pain-point on a market and address that with your app, you can solve a problem for users. By supplying them with constant, simple, and easy-to-understand data on their personal finance, you can turn your brand into a household name, quite literally.<\/p>\n\n\n\n\n\n<section id=\"contact\" class=\"contact-block block common-block \">\n  <div class=\"container\">\n\n\n    \n  <svg class=\"wave\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"280\" height=\"9\" viewBox=\"0 0 280 9\">\n    <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M0 3.6c2.88 0 4.18-.668 5.824-1.515C7.724 1.108 9.879 0 13.998 0c4.12 0 6.274 1.108 8.175 2.085 1.644.847 2.943 1.515 5.823 1.515 2.88 0 4.179-.668 5.824-1.515C35.72 1.108 37.874 0 41.995 0c4.12 0 6.274 1.108 8.174 2.085 1.645.847 2.945 1.515 5.824 1.515 2.88 0 4.18-.668 5.826-1.515C63.719 1.108 65.873 0 69.993 0c4.12 0 6.274 1.108 8.174 2.085 1.645.847 2.945 1.515 5.823 1.515 2.88 0 4.18-.668 5.825-1.515C91.715 1.108 93.87 0 97.99 0c4.12 0 6.273 1.108 8.174 2.085 1.645.847 2.945 1.515 5.823 1.515 2.88 0 4.178-.668 5.824-1.515 1.9-.977 4.054-2.085 8.173-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.88 0 4.18-.668 5.826-1.515 1.9-.977 4.055-2.085 8.175-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.88 0 4.179-.668 5.824-1.515 1.9-.977 4.054-2.085 8.175-2.085 4.12 0 6.274 1.108 8.175 2.085 1.646.847 2.946 1.515 5.826 1.515 2.88 0 4.18-.668 5.826-1.515 1.9-.977 4.054-2.085 8.175-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.881 0 4.18-.668 5.827-1.515 1.9-.977 4.056-2.085 8.176-2.085 4.121 0 6.276 1.108 8.177 2.085 1.646.847 2.946 1.515 5.827 1.515s4.181-.668 5.828-1.515C259.718 1.108 261.873 0 265.995 0c4.121 0 6.275 1.108 8.177 2.084 1.645.848 2.946 1.516 5.828 1.516V9h-.007l-5.252-.793c-1.129-.382-2.056-.848-2.919-1.291-1.646-.847-2.946-1.516-5.827-1.516-2.882 0-4.183.669-5.829 1.516-1.9.977-4.056 2.084-8.177 2.084-4.12 0-6.275-1.107-8.176-2.084-1.647-.847-2.947-1.516-5.828-1.516-2.88 0-4.18.669-5.827 1.516-1.9.977-4.055 2.084-8.176 2.084-4.12 0-6.273-1.107-8.175-2.084-1.645-.847-2.944-1.516-5.824-1.516s-4.18.669-5.826 1.516c-1.9.977-4.055 2.084-8.175 2.084-4.12 0-6.275-1.107-8.176-2.084-1.644-.847-2.945-1.516-5.825-1.516-2.88 0-4.18.669-5.825 1.516-1.9.977-4.054 2.084-8.174 2.084-4.12 0-6.274-1.107-8.176-2.084-1.644-.847-2.943-1.516-5.823-1.516-2.88 0-4.18.669-5.826 1.516-1.9.977-4.054 2.084-8.175 2.084-4.12 0-6.274-1.107-8.174-2.084-1.646-.847-2.946-1.516-5.825-1.516s-4.179.669-5.824 1.516c-1.9.977-4.053 2.084-8.173 2.084s-6.273-1.107-8.173-2.084c-1.645-.847-2.945-1.516-5.824-1.516-2.88 0-4.179.669-5.824 1.516C90.265 7.893 88.11 9 83.99 9c-4.12 0-6.273-1.107-8.173-2.084-1.645-.847-2.944-1.516-5.824-1.516s-4.18.669-5.825 1.516C62.268 7.893 60.113 9 55.993 9c-4.12 0-6.274-1.107-8.174-2.084-1.645-.847-2.945-1.516-5.824-1.516-2.88 0-4.18.669-5.825 1.516C34.27 7.893 32.116 9 27.996 9c-4.12 0-6.273-1.107-8.174-2.084-1.645-.847-2.945-1.516-5.824-1.516s-4.179.669-5.824 1.516C7.311 7.359 1.127 8.618 0 9\"\/>\n<\/svg>\n\n<h2 class=\"block-title section-title\">\n  Let&#8217;s talk about your project<\/h2>\n\n\n  <div class=\"block-description typography-body\">\n    <p>Do you want to create a performing application? I can make it work.<\/p>\n  <\/div>\n\n    \n          <div class=\"contact-block-person\">\n        <img loading=\"lazy\" decoding=\"async\" width=\"90\" height=\"90\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-90x90.png\" class=\"contact-block-person-image\" alt=\"\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-90x90.png 90w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-150x150.png 150w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-140x140.png 140w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-160x160.png 160w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6-136x136.png 136w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/09\/Olga_Pogorzelska_online-6.png 200w\" sizes=\"auto, (max-width: 90px) 100vw, 90px\" \/>        <div class=\"contact-block-person-text\">\n          <div class=\"typography-title-m\">\n            Olga Pogorzelska          <\/div>\n          <div class=\"typography-body-medium\">\n            New Business          <\/div>\n        <\/div>\n      <\/div>\n    \n\n    <form class=\"contact-form\" method=\"POST\" action=\"https:\/\/codeandpepper.com\/wp-admin\/admin-ajax.php\">\n            <amp-recaptcha-input layout=\"nodisplay\" name=\"recaptcha_token\" data-sitekey=\"6LeEo8cqAAAAABpahzrYQeEsO-xoutAjoIkrKpTB\" data-action=\"contact_block\"><\/amp-recaptcha-input>\n            <input type=\"hidden\" name=\"action\" value=\"contact_block_submit\" \/>\n      <input type=\"hidden\" name=\"block\" value=\"smallContactForm\" \/>\n      <input id=\"contact-email\" type=\"email\" name=\"email\" placeholder=\"Email\" class=\"gtm_form_input\" required>\n      <label for=\"contact-email\" class=\"contact-block-hidden-label\">Email<\/label>\n      <input id=\"contact-name\" type=\"text\" name=\"name\" placeholder=\"Full name\" class=\"gtm_form_input\" required>\n      <label for=\"contact-name\" class=\"contact-block-hidden-label\">\n        Full name      <\/label>\n\n      <input type=\"submit\" name=\"submit\" value=\"GET A QUOTE\" class=\"gtm_form_submit btn-big\">\n\n      <div submitting>\n      <\/div>\n      <div id=\"TYPSmallForm\" class=\"submit-msg submit-success\" submit-success>\n        <template type=\"amp-mustache\">\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"26\" height=\"26\" viewBox=\"0 0 26 26\">\n    <g fill=\"none\" fill-rule=\"evenodd\">\n        <g stroke=\"#FFF\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" transform=\"translate(1 1)\">\n            <path d=\"M17 8.5l-7.5 7L7 13\"\/>\n            <circle cx=\"12\" cy=\"12\" r=\"11.5\"\/>\n        <\/g>\n        <path d=\"M1 1h24v24H1z\"\/>\n    <\/g>\n<\/svg>\n          Your message has been sent. We will get back to you as soon as possible.\n        <\/template>\n      <\/div>\n      <div id=\"ErrorSmallForm\" class=\"submit-msg submit-error\" submit-error>\n        <template type=\"amp-mustache\">\n          <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"25\" height=\"25\" viewBox=\"0 0 25 25\">\n    <g fill=\"none\" fill-rule=\"evenodd\">\n        <g stroke=\"currentColor\" stroke-linejoin=\"round\">\n            <path stroke-linecap=\"round\" stroke-width=\"2\" d=\"M23.498 12.31c.105 6.075-4.923 11.086-10.998 11.192-6.074.104-10.893-4.734-10.998-10.81C1.396 6.619 6.426 1.606 12.5 1.502c6.074-.106 10.893 4.734 10.998 10.808zM12.5 14V7\"\/>\n            <path fill=\"currentColor\" stroke-width=\"1.5\" d=\"M13 17.5a.5.5 0 0 1-1 0 .5.5 0 0 1 1 0z\"\/>\n        <\/g>\n        <path d=\"M1 0h24v24H1z\"\/>\n    <\/g>\n<\/svg>\n          Oops! Something went wrong. Please try again later.\n        <\/template>\n      <\/div>\n    <\/form>\n\n\n  <\/div>\n<\/section>\n<style type=\"text\/css\">\n  #contact {\n    background: #009fe3;\n    color: #FFFFFF;\n  }\n\n  #contactsvg {\n    color: #ffffff;\n  }\n<\/style>\n\n<section id=\"related-posts-block_6290b7eb2009f\" class=\"related-posts-block block common-block \">\n  <div class=\"container\">\n\n\n    \n  <svg class=\"wave\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"280\" height=\"9\" viewBox=\"0 0 280 9\">\n    <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M0 3.6c2.88 0 4.18-.668 5.824-1.515C7.724 1.108 9.879 0 13.998 0c4.12 0 6.274 1.108 8.175 2.085 1.644.847 2.943 1.515 5.823 1.515 2.88 0 4.179-.668 5.824-1.515C35.72 1.108 37.874 0 41.995 0c4.12 0 6.274 1.108 8.174 2.085 1.645.847 2.945 1.515 5.824 1.515 2.88 0 4.18-.668 5.826-1.515C63.719 1.108 65.873 0 69.993 0c4.12 0 6.274 1.108 8.174 2.085 1.645.847 2.945 1.515 5.823 1.515 2.88 0 4.18-.668 5.825-1.515C91.715 1.108 93.87 0 97.99 0c4.12 0 6.273 1.108 8.174 2.085 1.645.847 2.945 1.515 5.823 1.515 2.88 0 4.178-.668 5.824-1.515 1.9-.977 4.054-2.085 8.173-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.88 0 4.18-.668 5.826-1.515 1.9-.977 4.055-2.085 8.175-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.88 0 4.179-.668 5.824-1.515 1.9-.977 4.054-2.085 8.175-2.085 4.12 0 6.274 1.108 8.175 2.085 1.646.847 2.946 1.515 5.826 1.515 2.88 0 4.18-.668 5.826-1.515 1.9-.977 4.054-2.085 8.175-2.085 4.12 0 6.273 1.108 8.174 2.085 1.646.847 2.945 1.515 5.825 1.515 2.881 0 4.18-.668 5.827-1.515 1.9-.977 4.056-2.085 8.176-2.085 4.121 0 6.276 1.108 8.177 2.085 1.646.847 2.946 1.515 5.827 1.515s4.181-.668 5.828-1.515C259.718 1.108 261.873 0 265.995 0c4.121 0 6.275 1.108 8.177 2.084 1.645.848 2.946 1.516 5.828 1.516V9h-.007l-5.252-.793c-1.129-.382-2.056-.848-2.919-1.291-1.646-.847-2.946-1.516-5.827-1.516-2.882 0-4.183.669-5.829 1.516-1.9.977-4.056 2.084-8.177 2.084-4.12 0-6.275-1.107-8.176-2.084-1.647-.847-2.947-1.516-5.828-1.516-2.88 0-4.18.669-5.827 1.516-1.9.977-4.055 2.084-8.176 2.084-4.12 0-6.273-1.107-8.175-2.084-1.645-.847-2.944-1.516-5.824-1.516s-4.18.669-5.826 1.516c-1.9.977-4.055 2.084-8.175 2.084-4.12 0-6.275-1.107-8.176-2.084-1.644-.847-2.945-1.516-5.825-1.516-2.88 0-4.18.669-5.825 1.516-1.9.977-4.054 2.084-8.174 2.084-4.12 0-6.274-1.107-8.176-2.084-1.644-.847-2.943-1.516-5.823-1.516-2.88 0-4.18.669-5.826 1.516-1.9.977-4.054 2.084-8.175 2.084-4.12 0-6.274-1.107-8.174-2.084-1.646-.847-2.946-1.516-5.825-1.516s-4.179.669-5.824 1.516c-1.9.977-4.053 2.084-8.173 2.084s-6.273-1.107-8.173-2.084c-1.645-.847-2.945-1.516-5.824-1.516-2.88 0-4.179.669-5.824 1.516C90.265 7.893 88.11 9 83.99 9c-4.12 0-6.273-1.107-8.173-2.084-1.645-.847-2.944-1.516-5.824-1.516s-4.18.669-5.825 1.516C62.268 7.893 60.113 9 55.993 9c-4.12 0-6.274-1.107-8.174-2.084-1.645-.847-2.945-1.516-5.824-1.516-2.88 0-4.18.669-5.825 1.516C34.27 7.893 32.116 9 27.996 9c-4.12 0-6.273-1.107-8.174-2.084-1.645-.847-2.945-1.516-5.824-1.516s-4.179.669-5.824 1.516C7.311 7.359 1.127 8.618 0 9\"\/>\n<\/svg>\n\n<h2 class=\"block-title section-title\">\n  Related posts<\/h2>\n\n\n\n    <div>\n      <div class=\"related-posts\">\n                  <div class=\"related-post\">\n            <h3 class=\"related-post-title typography-title-m\">\n              <a href=\"https:\/\/codeandpepper.com\/data-visualization-ux-best-practices\/\" title=\"Best Practices for Data Visualization\">\n                Best Practices for Data Visualization              <\/a>\n            <\/h3>\n                          <a class=\"related-post-thumbnail\" aria-label=\"Best Practices for Data Visualization\" href=\"https:\/\/codeandpepper.com\/data-visualization-ux-best-practices\/\">\n                <img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"189\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX.jpeg\" class=\"attachment-blog-thumbnail size-blog-thumbnail wp-post-image\" alt=\"Data visualization ux best practices &amp; bad patterns\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX.jpeg 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-768x400.jpeg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-80x42.jpeg 80w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-119x62.jpeg 119w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-433x226.jpeg 433w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-192x100.jpeg 192w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-720x375.jpeg 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-visualisation-UX-432x225.jpeg 432w\" sizes=\"auto, (max-width: 360px) 100vw, 360px\" \/>              <\/a>\n                        <p class=\"related-post-description typography-body-smaller\">\n              Data visualization, UX in general, helps grow revenue for FinTech applications. What are best practices and bad patterns in the industry?            <\/p>\n            <a class=\"plus-link\" href=\"https:\/\/codeandpepper.com\/data-visualization-ux-best-practices\/\">\n              <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 17 17\">\n    <path d=\"M7 0h3v17H7z\"\/>\n    <path d=\"M17 7v3H0V7z\"\/>\n<\/svg>\n              <span>Full Article<\/span>\n            <\/a>\n          <\/div>\n                  <div class=\"related-post\">\n            <h3 class=\"related-post-title typography-title-m\">\n              <a href=\"https:\/\/codeandpepper.com\/web3-defi-impact-on-fintech\/\" title=\"How DeFi and Web3 Will Impact FinTech?\">\n                How DeFi and Web3 Will Impact FinTech?              <\/a>\n            <\/h3>\n                          <a class=\"related-post-thumbnail\" aria-label=\"How DeFi and Web3 Will Impact FinTech?\" href=\"https:\/\/codeandpepper.com\/web3-defi-impact-on-fintech\/\">\n                <img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"189\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-360x189.jpeg\" class=\"attachment-blog-thumbnail size-blog-thumbnail wp-post-image\" alt=\"how web3 will impact financial industry\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-360x189.jpeg 360w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-768x400.jpeg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-433x226.jpeg 433w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-432x225.jpeg 432w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry-200x104.jpeg 200w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2022\/05\/DeFi-and-Web3-Future-of-Finance-Industry.jpeg 864w\" sizes=\"auto, (max-width: 360px) 100vw, 360px\" \/>              <\/a>\n                        <p class=\"related-post-description typography-body-smaller\">\n              Web 3.0 will significantly impact FinTech industry. Decentralized data and AI will shape apps of the future. Learn more from the article!            <\/p>\n            <a class=\"plus-link\" href=\"https:\/\/codeandpepper.com\/web3-defi-impact-on-fintech\/\">\n              <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 17 17\">\n    <path d=\"M7 0h3v17H7z\"\/>\n    <path d=\"M17 7v3H0V7z\"\/>\n<\/svg>\n              <span>Full Article<\/span>\n            <\/a>\n          <\/div>\n                  <div class=\"related-post\">\n            <h3 class=\"related-post-title typography-title-m\">\n              <a href=\"https:\/\/codeandpepper.com\/best-data-management-and-business-intelligence-tools\/\" title=\"Top Data Analytics Tools for FinTech\">\n                Top Data Analytics Tools for FinTech              <\/a>\n            <\/h3>\n                          <a class=\"related-post-thumbnail\" aria-label=\"Top Data Analytics Tools for FinTech\" href=\"https:\/\/codeandpepper.com\/best-data-management-and-business-intelligence-tools\/\">\n                <img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"189\" src=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech.jpeg\" class=\"attachment-blog-thumbnail size-blog-thumbnail wp-post-image\" alt=\"Data storage management tools\" srcset=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech.jpeg 864w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-768x400.jpeg 768w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-80x42.jpeg 80w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-119x62.jpeg 119w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-433x226.jpeg 433w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-192x100.jpeg 192w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-720x375.jpeg 720w, https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/09\/Data-Analytics-and-Business-Intelligence-Tools-for-FinTech-432x225.jpeg 432w\" sizes=\"auto, (max-width: 360px) 100vw, 360px\" \/>              <\/a>\n                        <p class=\"related-post-description typography-body-smaller\">\n              There are many ways to boost your FinTech product. One of them is Big Data but you need reliable tools to dig through information. We can help you choose.            <\/p>\n            <a class=\"plus-link\" href=\"https:\/\/codeandpepper.com\/best-data-management-and-business-intelligence-tools\/\">\n              <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 17 17\">\n    <path d=\"M7 0h3v17H7z\"\/>\n    <path d=\"M17 7v3H0V7z\"\/>\n<\/svg>\n              <span>Full Article<\/span>\n            <\/a>\n          <\/div>\n              <\/div>\n    <\/div>\n\n\n  <\/div>\n<\/section>\n\n<style type=\"text\/css\">\n  #related-posts-block_6290b7eb2009f {\n    background: ;\n    color: ;\n  }\n\n  #related-posts-block_6290b7eb2009f .block-title {\n    color: ;\n  }\n<\/style>","protected":false},"excerpt":{"rendered":"<p>Unless it\u2019s about counting money on our bank account, then for many of us, numbers are hard to remember and boring. We need a context and a good reason to process them. Not to mention making something useful out of it. The same goes for FinTech users. What if you could help them through storytelling?<\/p>\n","protected":false},"author":20413,"featured_media":22914,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[1648],"tags":[1600,1654,1652],"class_list":["post-22189","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux","tag-fintech-app-development","tag-fintech-software-development","tag-fintech-trends"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper<\/title>\n<meta name=\"description\" content=\"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper\" \/>\n<meta property=\"og:description\" content=\"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\" \/>\n<meta property=\"og:site_name\" content=\"Code &amp; Pepper\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codeandpepper\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-09T07:30:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-05-27T11:39:28+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"864\" \/>\n\t<meta property=\"og:image:height\" content=\"450\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jaros\u0142aw \u015aci\u015blak\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@codeandpepper\" \/>\n<meta name=\"twitter:site\" content=\"@codeandpepper\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jaros\u0142aw \u015aci\u015blak\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\"},\"author\":{\"name\":\"Jaros\u0142aw \u015aci\u015blak\",\"@id\":\"https:\/\/codeandpepper.com\/#\/schema\/person\/4d99a36115b17f10860637a13b3b3885\"},\"headline\":\"Storytelling with Data: 5 Steps to Create an In-App Data Visualization\",\"datePublished\":\"2021-03-09T07:30:56+00:00\",\"dateModified\":\"2022-05-27T11:39:28+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\"},\"wordCount\":1237,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/codeandpepper.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\",\"keywords\":[\"FinTech app development\",\"FinTech software development\",\"FinTech trends\"],\"articleSection\":[\"User Experience\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\",\"url\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\",\"name\":\"Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper\",\"isPartOf\":{\"@id\":\"https:\/\/codeandpepper.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\",\"datePublished\":\"2021-03-09T07:30:56+00:00\",\"dateModified\":\"2022-05-27T11:39:28+00:00\",\"description\":\"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?\",\"breadcrumb\":{\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage\",\"url\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\",\"contentUrl\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg\",\"width\":864,\"height\":450,\"caption\":\"Bringing data to life with good storytelling\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/codeandpepper.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Storytelling with Data: 5 Steps to Create an In-App Data Visualization\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codeandpepper.com\/#website\",\"url\":\"https:\/\/codeandpepper.com\/\",\"name\":\"Code & Pepper\",\"description\":\"FinTech Developers\",\"publisher\":{\"@id\":\"https:\/\/codeandpepper.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codeandpepper.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/codeandpepper.com\/#organization\",\"name\":\"Code & Pepper\",\"url\":\"https:\/\/codeandpepper.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codeandpepper.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/06\/logo.png\",\"contentUrl\":\"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/06\/logo.png\",\"width\":319,\"height\":144,\"caption\":\"Code & Pepper\"},\"image\":{\"@id\":\"https:\/\/codeandpepper.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/codeandpepper\/\",\"https:\/\/x.com\/codeandpepper\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/codeandpepper.com\/#\/schema\/person\/4d99a36115b17f10860637a13b3b3885\",\"name\":\"Jaros\u0142aw \u015aci\u015blak\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codeandpepper.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/ab028da5fc780b19966f305918b0045520176e8bc7c265540adcce45ab2cd0c9?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/ab028da5fc780b19966f305918b0045520176e8bc7c265540adcce45ab2cd0c9?s=96&d=mm&r=g\",\"caption\":\"Jaros\u0142aw \u015aci\u015blak\"},\"description\":\"Branding, marketing, business scaling, content &amp; company culture specialist. Over 20 years of experience in marketing, strategy, and writing. Learn more by visiting: scislak.com\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/jaroslawscislak\"],\"url\":\"https:\/\/codeandpepper.com\/author\/jarek-scislak\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper","description":"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/","og_locale":"en_US","og_type":"article","og_title":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper","og_description":"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?","og_url":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/","og_site_name":"Code &amp; Pepper","article_publisher":"https:\/\/www.facebook.com\/codeandpepper\/","article_published_time":"2021-03-09T07:30:56+00:00","article_modified_time":"2022-05-27T11:39:28+00:00","og_image":[{"width":864,"height":450,"url":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg","type":"image\/jpeg"}],"author":"Jaros\u0142aw \u015aci\u015blak","twitter_card":"summary_large_image","twitter_creator":"@codeandpepper","twitter_site":"@codeandpepper","twitter_misc":{"Written by":"Jaros\u0142aw \u015aci\u015blak","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#article","isPartOf":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/"},"author":{"name":"Jaros\u0142aw \u015aci\u015blak","@id":"https:\/\/codeandpepper.com\/#\/schema\/person\/4d99a36115b17f10860637a13b3b3885"},"headline":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization","datePublished":"2021-03-09T07:30:56+00:00","dateModified":"2022-05-27T11:39:28+00:00","mainEntityOfPage":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/"},"wordCount":1237,"commentCount":0,"publisher":{"@id":"https:\/\/codeandpepper.com\/#organization"},"image":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage"},"thumbnailUrl":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg","keywords":["FinTech app development","FinTech software development","FinTech trends"],"articleSection":["User Experience"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/","url":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/","name":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization | Code &amp; Pepper","isPartOf":{"@id":"https:\/\/codeandpepper.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage"},"image":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage"},"thumbnailUrl":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg","datePublished":"2021-03-09T07:30:56+00:00","dateModified":"2022-05-27T11:39:28+00:00","description":"Storytelling with data and brining life to numbers is a skill of the future. Especially when it comes to FinTech products. How to do it right?","breadcrumb":{"@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#primaryimage","url":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg","contentUrl":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2021\/03\/Storytelling-with-Data.jpg","width":864,"height":450,"caption":"Bringing data to life with good storytelling"},{"@type":"BreadcrumbList","@id":"https:\/\/codeandpepper.com\/storytelling-with-data-5-steps-to-create-an-in-app-data-visualization\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codeandpepper.com\/"},{"@type":"ListItem","position":2,"name":"Storytelling with Data: 5 Steps to Create an In-App Data Visualization"}]},{"@type":"WebSite","@id":"https:\/\/codeandpepper.com\/#website","url":"https:\/\/codeandpepper.com\/","name":"Code & Pepper","description":"FinTech Developers","publisher":{"@id":"https:\/\/codeandpepper.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codeandpepper.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/codeandpepper.com\/#organization","name":"Code & Pepper","url":"https:\/\/codeandpepper.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codeandpepper.com\/#\/schema\/logo\/image\/","url":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/06\/logo.png","contentUrl":"https:\/\/codeandpepper.com\/wp-content\/uploads\/2019\/06\/logo.png","width":319,"height":144,"caption":"Code & Pepper"},"image":{"@id":"https:\/\/codeandpepper.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codeandpepper\/","https:\/\/x.com\/codeandpepper"]},{"@type":"Person","@id":"https:\/\/codeandpepper.com\/#\/schema\/person\/4d99a36115b17f10860637a13b3b3885","name":"Jaros\u0142aw \u015aci\u015blak","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codeandpepper.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/ab028da5fc780b19966f305918b0045520176e8bc7c265540adcce45ab2cd0c9?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ab028da5fc780b19966f305918b0045520176e8bc7c265540adcce45ab2cd0c9?s=96&d=mm&r=g","caption":"Jaros\u0142aw \u015aci\u015blak"},"description":"Branding, marketing, business scaling, content &amp; company culture specialist. Over 20 years of experience in marketing, strategy, and writing. Learn more by visiting: scislak.com","sameAs":["https:\/\/www.linkedin.com\/in\/jaroslawscislak"],"url":"https:\/\/codeandpepper.com\/author\/jarek-scislak\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/posts\/22189","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/users\/20413"}],"replies":[{"embeddable":true,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/comments?post=22189"}],"version-history":[{"count":11,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/posts\/22189\/revisions"}],"predecessor-version":[{"id":36766,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/posts\/22189\/revisions\/36766"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/media\/22914"}],"wp:attachment":[{"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/media?parent=22189"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/categories?post=22189"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codeandpepper.com\/wp-json\/wp\/v2\/tags?post=22189"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}