{"id":24585,"date":"2021-10-15T16:20:41","date_gmt":"2021-10-15T23:20:41","guid":{"rendered":"https:\/\/www.podfeet.com\/blog\/?p=24585"},"modified":"2021-10-15T17:50:56","modified_gmt":"2021-10-16T00:50:56","slug":"crowd-source-time-adder","status":"publish","type":"post","link":"https:\/\/www.podfeet.com\/blog\/2021\/10\/crowd-source-time-adder\/","title":{"rendered":"Help Me Design the Layout of a Time Adder App"},"content":{"rendered":"<p>You\u2019ve heard me drone on about how to add time using Excel, and that struggle over the years has inspired me to write a web app to add and subtract time.  It seems like a fun project, and within grasp of my skills so far in programming. I\u2019ve already started working on it, and at the rate I seem to be able to carve out time, it should be ready in a year or two.<\/p>\n<p>I have a vision of what the app layout would look like, but I thought it would be fun if we crowdsourced this a little bit. You don\u2019t have to approach this as a programmer, in fact, I\u2019d prefer it if you thought about it from a regular human perspective.<\/p>\n<p>If you wanted to add and\/or subtract a bunch of times together and get an answer, in an ideal world, how would you lay that out to be efficient and easy to use without instructions?<\/p>\n<p>Here are some things to consider:<\/p>\n<ul>\n<li>Should there be separate fields for the hours, minutes, and seconds?\n<ul>\n<li>Or maybe the user should have to entire the time in 00:00:00.0 format?<\/li>\n<\/ul>\n<\/li>\n<li>How many hours maximum should I allow?<\/li>\n<li>Should I allow decimal seconds? How many digits should I allow?<\/li>\n<li>Are there buttons for add and subtract?<\/li>\n<li>Should those add\/subtract buttons be on the left, or right, or maybe even in their own row in between the time entry fields?<\/li>\n<li>Should the total update when you\u2019re done entering the last number, or should it update only when you hit an add or subtract or maybe an equals button? Would it be distracting if it\u2019s auto-updating the total, or would that be awesome?<\/li>\n<li>Should the total be at the top or the bottom? If it\u2019s at the bottom I\u2019d have to make sure it doesn\u2019t roll offscreen<\/li>\n<li>Think about mobile in the layout &#8211; how to use the small space efficiently but without making the UI hard to understand.<\/li>\n<li>Would you choose a different layout if it\u2019s on mobile vs a bigger screen?<\/li>\n<li>What haven\u2019t I taken into consideration?<\/li>\n<\/ul>\n<p>Now here\u2019s the fun part. I don\u2019t want you to answer in words. I want you to draw me a picture.  Use your fancy pants Apple Pencil and your iPad in Apple Notes, use Omnigraffle on the Mac to draw pretty buttons and fields, use engineering quadrille paper with a straight edge and a mechanical pencil, or use a crayon, scissors, and construction paper.<\/p>\n<p>I don\u2019t care how you create your picture as long as it conveys your vision of the perfect layout for a Time Adder app.  Oh and how about the name? Time Adder does say most of it, but I\u2019ve never been good at naming things, so suggestions are welcome.<\/p>\n<p>I posted this question in our Slack at <a href=\"https:\/\/podfeet.com\/slack\">podfeet.com\/slack<\/a> and Allister Jenks and Nuclear Jon have both sent in some great drawings. If you want to answer over there that\u2019s great, or if you want to send me an email at <a href=\"mailto:allison@podfeet.com\" target=\"_blank\" rel=\"noopener\">allison@podfeet.com<\/a>, or you could Tweet it at me @podfeet. Any way you want to show me your vision would be awesome.<\/p>\n<p>Thanks in advance for your ideas!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>You\u2019ve heard me drone on about how to add time using Excel, and that struggle over the years has inspired me to write a web app to add and subtract time. It seems like a fun project, and within grasp of my skills so far in programming. I\u2019ve already started working on it, and at [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":24588,"comment_status":"open","ping_status":"closed","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":""},"categories":[147],"tags":[1336,1625,1517,2651,4154,3583],"class_list":["post-24585","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog-posts","tag-app","tag-clock","tag-design","tag-layout","tag-time","tag-web-app"],"jetpack_featured_media_url":"https:\/\/www.podfeet.com\/blog\/wp-content\/uploads\/2021\/10\/Plus-Minus-Clock-1.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/posts\/24585","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/comments?post=24585"}],"version-history":[{"count":2,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/posts\/24585\/revisions"}],"predecessor-version":[{"id":24587,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/posts\/24585\/revisions\/24587"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/media\/24588"}],"wp:attachment":[{"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/media?parent=24585"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/categories?post=24585"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.podfeet.com\/blog\/wp-json\/wp\/v2\/tags?post=24585"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}