{"id":686,"date":"2016-10-28T10:56:08","date_gmt":"2016-10-28T18:56:08","guid":{"rendered":"http:\/\/undebt.it\/blog\/?p=686"},"modified":"2021-02-16T15:30:47","modified_gmt":"2021-02-16T23:30:47","slug":"undebt-version-4-redesign-preview","status":"publish","type":"post","link":"https:\/\/undebt.it\/blog\/undebt-version-4-redesign-preview\/","title":{"rendered":"Undebt.it Version #4 Redesign Preview"},"content":{"rendered":"<h2>Redesign Background<\/h2>\n<p>Over the past two months I&#8217;ve been hard at work developing the next version of Undebt.it and I&#8217;m happy to announce that it&#8217;s finally ready to go. Much of the feedback I&#8217;ve received had to do with streamlining &amp; consolidating the pages and making it work even better on mobile devices so I&#8217;ve made those two areas the main focus of the redesign. The biggest design change in this version is the use of a &#8220;front-end&#8221; and &#8220;back-end&#8221; type design. What this means is there are two different themes in place, one for the general content, like the main page and <em>How Undebt.it Works<\/em> page and another theme for the guts of the site, like the <em>Dashboard<\/em> and <em>Snowball Table<\/em> pages. Of course, there&#8217;s also a new logo and color scheme too.<\/p>\n<p><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-logo-boxed.png\"><img decoding=\"async\" class=\"aligncenter wp-image-709 size-full\" title=\"new logo boxed\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-logo-boxed.png\" alt=\"new logo boxed\" width=\"297\" height=\"91\" \/><\/a><\/p>\n<h2>New Stuff on the Navbar<\/h2>\n<p>Here&#8217;s an example of the new statbar on the top of the navbar on the back-end pages. Much of the information is the same as the current site, but there are some cool, new features. The blue bars in the picture represent your total monthly balance for the last twelve months. You can quickly see how you&#8217;re doing overall with this graph. The other new feature is the calendar icon with the number in the circle. I call this the &#8220;quick look&#8221; and it shows you how many debts (&amp; bills if you have it turned on) you have due within a week. There&#8217;s a similar looking pulldown on the front-end pages too.<\/p>\n<table>\n<tbody>\n<tr>\n<td>\n<p><div id=\"attachment_687\" style=\"width: 603px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/statbar.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-687\" class=\"wp-image-687 size-full\" title=\"New statbar desgin\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/statbar.png\" alt=\"New statbar desgin\" width=\"593\" height=\"246\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/statbar.png 593w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/statbar-300x124.png 300w\" sizes=\"(max-width: 593px) 100vw, 593px\" \/><\/a><p id=\"caption-attachment-687\" class=\"wp-caption-text\">New statbar desgin<\/p><\/div><\/td>\n<td>\n<p><div id=\"attachment_689\" style=\"width: 333px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-689\" class=\"wp-image-689 size-full\" title=\"Quick Look menu\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look.png\" alt=\"Quick Look menu\" width=\"323\" height=\"406\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look.png 323w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-239x300.png 239w\" sizes=\"(max-width: 323px) 100vw, 323px\" \/><\/a><p id=\"caption-attachment-689\" class=\"wp-caption-text\">Quick look pulldown menu<\/p><\/div><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Bonus Stuff on the Right Sidebar<\/h2>\n<p>For the Undebt.it+ members, there&#8217;s also a quick look right-sidebar. At the far top-right of the screen, you&#8217;ll see a box with an arrow in it; this is the toggle for the right sidebar. The sidebar has two columns right now, one that shows you a complete list of your debts and bills grouped together by due date and the other column shows you a list of all of your recent transactions (paying debts &amp; bills). Let me know if you have any ideas for more content on these menus.<\/p>\n<table>\n<tbody>\n<tr>\n<td>\n<p><div id=\"attachment_692\" style=\"width: 365px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-692\" class=\"wp-image-692 size-full\" title=\"quick look sidebar accounts\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar.png\" alt=\"quick look sidebar accounts\" width=\"355\" height=\"671\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar.png 355w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar-159x300.png 159w\" sizes=\"(max-width: 355px) 100vw, 355px\" \/><\/a><p id=\"caption-attachment-692\" class=\"wp-caption-text\">Quick look sidebar (all accounts)<\/p><\/div><\/td>\n<td>\n<p><div id=\"attachment_693\" style=\"width: 374px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar-activity.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-693\" class=\"wp-image-693\" title=\"quick look sidebar activity\" src=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar-activity.png\" alt=\"quick look sidebar activity\" width=\"364\" height=\"659\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar-activity.png 361w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/quick-look-sidebar-activity-166x300.png 166w\" sizes=\"(max-width: 364px) 100vw, 364px\" \/><\/a><p id=\"caption-attachment-693\" class=\"wp-caption-text\">Quick look sidebar (all activity)<\/p><\/div><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Dashboard Changes<\/h2>\n<p>The main change is that it&#8217;s called the &#8220;Dashboard&#8221; instead of the &#8220;Debt Dashboard&#8221;. If you use the bill management module, you&#8217;ll see debts and bills combined onto one page rather their own dashboard. Note that the debt accounts are in due date &#8220;buckets&#8221; like the bills. I&#8217;m planning on making the buckets user-selectable in the future.<\/p>\n<div id=\"attachment_696\" style=\"width: 1327px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-696\" class=\"wp-image-696 size-full\" title=\"The new dashboard\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard.png\" alt=\"The new dashboard\" width=\"1317\" height=\"767\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard.png 1317w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard-300x175.png 300w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard-768x447.png 768w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-dashboard-1024x596.png 1024w\" sizes=\"(max-width: 1317px) 100vw, 1317px\" \/><\/a><p id=\"caption-attachment-696\" class=\"wp-caption-text\">The new dashboard<\/p><\/div>\n<h2>The Account List<\/h2>\n<p>Like the Dashboard, the account list pages have been consolidated into one page. Debts &amp; bills on the same page, easily add new accounts. Not much else new on this page.<\/p>\n<table>\n<tbody>\n<tr>\n<td>\n<p><div id=\"attachment_698\" style=\"width: 672px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-debts.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-698\" class=\"wp-image-698\" title=\"account list page\" src=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-debts.png\" alt=\"account list page\" width=\"662\" height=\"349\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-debts.png 791w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-debts-300x158.png 300w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-debts-768x405.png 768w\" sizes=\"(max-width: 662px) 100vw, 662px\" \/><\/a><p id=\"caption-attachment-698\" class=\"wp-caption-text\">Debts accounts<\/p><\/div><\/td>\n<\/tr>\n<tr>\n<td>\n<p><div id=\"attachment_699\" style=\"width: 539px\" class=\"wp-caption alignleft\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-bill.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-699\" class=\"wp-image-699\" title=\"bill accounts\" src=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-bill.png\" alt=\"bill accounts\" width=\"529\" height=\"312\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-bill.png 635w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/new-bill-300x177.png 300w\" sizes=\"(max-width: 529px) 100vw, 529px\" \/><\/a><p id=\"caption-attachment-699\" class=\"wp-caption-text\">Bill accounts on the same page<\/p><\/div><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Account Details<\/h2>\n<p>The left sidebar has some nice changes too. The debt account list shows the balance, amount due and payoff progress. Also note the green checkmark on one of the accounts &#8211; this indicates that the account was paid off this month. The bill list shows the amount due and due date.<\/p>\n<p>The details pages for debts and bills has been revamped to quickly show account history with an inline bar graph. The graph is an Undebt.it+ feature and shows a running monthly history of up to two years. The up\/down arrows next to the account balance show if the balance has gone up versus last month. Hover your mouse over the arrow and you&#8217;ll see a popover message like the one below.<\/p>\n<table>\n<tbody>\n<tr>\n<td>\n<p><div id=\"attachment_700\" style=\"width: 277px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-debts.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-700\" class=\"wp-image-700\" title=\"left sidebar debts\" src=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-debts.png\" alt=\"left sidebar debts\" width=\"267\" height=\"661\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-debts.png 262w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-debts-121x300.png 121w\" sizes=\"(max-width: 267px) 100vw, 267px\" \/><\/a><p id=\"caption-attachment-700\" class=\"wp-caption-text\">Left sidebar debt info<\/p><\/div><\/td>\n<td>\n<p><div id=\"attachment_701\" style=\"width: 272px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-bills.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-701\" class=\"wp-image-701 size-full\" title=\"left sidebar bills\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-bills.png\" alt=\"left sidebar bills\" width=\"262\" height=\"681\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-bills.png 262w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/left-sidebar-bills-115x300.png 115w\" sizes=\"(max-width: 262px) 100vw, 262px\" \/><\/a><p id=\"caption-attachment-701\" class=\"wp-caption-text\">Left sidebar bill info<\/p><\/div><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<table>\n<tbody>\n<tr>\n<td>\n<p><div id=\"attachment_705\" style=\"width: 519px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/debt-details-1-e1477679089105.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-705\" class=\"wp-image-705 size-full\" title=\"debt details page\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/debt-details-1-e1477679089105.png\" alt=\"debt details page\" width=\"509\" height=\"446\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/debt-details-1-e1477679089105.png 509w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/debt-details-1-e1477679089105-300x263.png 300w\" sizes=\"(max-width: 509px) 100vw, 509px\" \/><\/a><p id=\"caption-attachment-705\" class=\"wp-caption-text\">Debt details &amp; history<\/p><\/div><\/td>\n<\/tr>\n<tr>\n<td>\n<p><div id=\"attachment_703\" style=\"width: 431px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/bill-details-1.png\"><img decoding=\"async\" aria-describedby=\"caption-attachment-703\" class=\"wp-image-703 size-full\" title=\"bill details history\" src=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/bill-details-1.png\" alt=\"bill details history\" width=\"421\" height=\"349\" srcset=\"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/bill-details-1.png 421w, https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/bill-details-1-300x249.png 300w\" sizes=\"(max-width: 421px) 100vw, 421px\" \/><\/a><p id=\"caption-attachment-703\" class=\"wp-caption-text\">Bill details &amp; history<\/p><\/div><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Wrapping it up<\/h2>\n<p>That just about covers all of the changes in the fourth generation of Undebt.it. I&#8217;m doing the final testing now and hope to have it all switched over this weekend. If you&#8217;d like to test it out, just use one of the contact forms or message me on social media. I hope you like all of the changes.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Redesign Background Over the past two months I&#8217;ve been hard at work developing the next version of Undebt.it and I&#8217;m happy to announce that it&#8217;s finally ready to go. Much of the feedback I&#8217;ve&#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":687,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"See what's new with the Undebt.it website redesign. Plenty of new bells and whistles.","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[8],"tags":[16],"class_list":["post-686","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-features","tag-redesign"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/undebt.it\/blog\/wp-content\/uploads\/2016\/10\/statbar.png","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3b4HR-b4","_links":{"self":[{"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/posts\/686","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/comments?post=686"}],"version-history":[{"count":15,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/posts\/686\/revisions"}],"predecessor-version":[{"id":1693,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/posts\/686\/revisions\/1693"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/media\/687"}],"wp:attachment":[{"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/media?parent=686"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/categories?post=686"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/undebt.it\/blog\/wp-json\/wp\/v2\/tags?post=686"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}