{"id":5484,"date":"2019-06-17T17:32:48","date_gmt":"2019-06-17T15:32:48","guid":{"rendered":"https:\/\/toshl.com\/blog\/?p=5484"},"modified":"2019-06-19T10:37:02","modified_gmt":"2019-06-19T08:37:02","slug":"the-toshl-web-app-gets-a-new-design-a-chat-with-janez-and-jan","status":"publish","type":"post","link":"https:\/\/toshl.com\/blog\/the-toshl-web-app-gets-a-new-design-a-chat-with-janez-and-jan\/","title":{"rendered":"The Toshl Web App Gets a New Design: a Chat with Janez and Jan"},"content":{"rendered":"\n

We’re starting something a little different on our blog today. Instead of just telling you what’s new, we’ll have a chat with Toshl\u2019s team members. Today we’re meeting Janez and Jan. No, they are not one of the Toshl monsters, they are humans and they are real. Or at least we certainly hope so. ;) One envisions the app’s unique design, while the other puts the ideas into practice by coding. In this chat, we\u2019ll talk about the redesign of the Toshl Finance Web App and their work in this project.<\/p>\n\n\n\n

<\/p>\n\n\n\n

Guys, could you introduce yourself? What are your main duties at Toshl?<\/em><\/strong><\/p>\n\n\n\n

Janez:<\/strong> <\/em>I\u2019m in charge of the design and illustration. This part is quite important for Toshl Finance apps. So my job is about creating the interface of our apps and graphics in general.<\/p>\n\n\n\n

Jan:<\/strong> I bring designs of Janez to life. I\u2019m in charge of web app development. In other words, it is my task to transform the data into web pictures in the browser, so they look like we imagined them. And, of course, we discuss how things should look like together with Janez. It\u2019s constant teamwork.<\/p>\n\n\n\n

<\/p>\n\n\n\n

Toshl\u2019s web app has changed significantly with the latest release. What was the purpose of this transformation?<\/em><\/strong><\/p>\n\n\n\n

Janez:<\/strong> We wanted to achieve a new feel for the whole app, so that it looks lighter. We paid attention to optimising the entire experience, not only the bare graphical interface.  <\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

Jan:<\/strong> <\/em>We saw a chance to make the app look fresh. The previous version of the web app was developed about 4 years ago, and these are light years in the IT industry. Thus it needed some updates. The timing of the overall redesign coincided with the code refactoring that we did. Now the things comply with the latest industry standards and it is easier to make additional upgrades.<\/p>\n\n\n\n

<\/p>\n\n\n\n

How could we see it in user experience?<\/em><\/strong><\/p>\n\n\n\n

Jan:<\/strong> The previous version was very flat and hierarchical relationships between view parts and elements were not really clear.  Now, when we added different shadows to the elements and made them look floating, when we put some things in the background and placed others in the front, it looks more clear. With the recent changes, it is quite simple to understand what you need to click next on the screen.<\/p>\n\n\n

<\/div>