In software development, anything involving a user interface typically gets wireframes developed before any code is written. Wireframes, or mockups, are designs for user interfaces that don't involve any code, just images of what the various screens (pages, menus, etc) in the user interface will look like. These are created by UX designers and then discussed with team leadership and front end engineers.
Leading up to an eventual 1.0 release, I've started working on wireframes for a cleaner, more modern experience in Time Matters.
Time Matters uses the Python package Tkinter for rendering graphics. This package basically wraps very, very old, legacy OS packages (the TK in Tkinter) that deal with graphical output, so its capabilities are very limited. In short, it looks old because it is old.
We do have some options for updating this that aren't massive undertakings. Most of these are extension packages for Tkinter, and should be as simple as using their available code the same as any other package Time Matters uses. (With me learning a bit along the way, fixing any incompatibilities between old and new UI code, etc.) Obviously, the actual reorganization of menus is still a normal coding process, but hooking up to new packages should be straightforward.
I've started working on wireframes for Time Matters based on the Custom Tkinter package. Technical info, as well as image examples, can be found here. https://customtkinter.tomschimansky.com/
Keep in mind these wires are relatively forward-thinking, and so they include space for options and selections that are not implemented yet (tons of solunar return types, potential paran options, etc). In the intervening time before those features are implemented, the buttons will either be disabled or just absent. I'm sure there's still much to discuss on those unimplemented topics.
Wireframes can be found at the URL below. I believe that this URL will stay fixed even as I make changes, so we shouldn't need to update this. It should be public; let me know if you can't view it for some reason.
I also will add (and have already added) comments, which you can view as little speech bubbles on the canvas itself with E for Ember on them. If you have (or get) a Figma account and want comment access so you can add comments, just let me know what your email is for your Figma account and I'll add you.
https://www.figma.com/design/jGyqh24WEt ... X-redesign
I'd love any feedback.
Road to 1.0: UI/UX redesign wireframes
Re: Road to 1.0: UI/UX redesign wireframes
It looks really good, I like it.
-
Jim Eshelman
- Are You Sirius?
- Posts: 19572
- Joined: Sun May 07, 2017 12:40 pm
Re: Road to 1.0: UI/UX redesign wireframes
Agreed. And I trust you on such things anyway. (It took me forever to find how to zoom so I could see them at all, I thought they were just unclickable thumbnails.)
Small stuff:
On chart input page, you only have time zone offset in hours and minutes. We need seconds (e.g., for LMT and LAT, though not for full standard zones).
Same page, Options section. Something isn't obvious about this. Maybe label it "Select Options" (or maybe "Options File"), change the second button to "Create Temp[orary]," etc. I'm guessing the currently selected (e.g., default) options file name automatically populate, which will simplify / change some of that.
Select Chart screen is definitely an improvement. I wonder, though, if "More Charts" shouldn't still go bottom center because it intuitively make sense as a vertical continuation of the list above it.
Chart Options page is a major improvement, and perhaps leaves room for expansion (I suspect that's in your calculations). "Use Vertex" is misleading since Vertex is always "used" (Vx Av shown) regardless of whether Vertex is listed in the angles table, isn't it? (Or did we agree it isn't. I forget.) Nodes could be slightly simplified as "True Node / Mean Node / No Node" (PS I just realized we should put True first so someone who doesn't know the difference likely picks it). "Don't Mark" should be a check box, since it is a choice with all the three variations before it, not an alternative. - There's room to add Paran orbs under the Mundane Aspect Orbs table (and perhaps put the aspect designations on the right edge). -- I don't see the Show Aspects row. -- I tend to think the "close / moderate / wide" explanations are needed since aspect classes are pretty unique to us (maybe fit it between the angles and aspects panels, since it applies to both?).
Midpoints panel is well organized. - One question: Is this a general (across all options) panel and not something that comes up for each Options file? I'm confused by picking natals and ingresses together and also picking solunars from the same spot. That's not needed if these are unique to each options file.
Ah, I see you already have a spot for Potential Parans. Maybe that's indeed the way to go - especially now. (If they prove themselves essential in the way that mundane aspects are, that probably should go on the earlier page; but I suppose the same argument could be made for PVPs.) In any case, it looks really good the way you have it.
Ingress page: Extremely usable. Personally, I'd want the Select All and Clear Selections buttons, I use them often. "All for one year" is well placed - will this also be greyed out if Forwards isn't selected? An alternative is to put the word "Forward" under the current line (making it "All selected for 1 year forward") which automatically checks the Forwards button also. -- Picky observation: "Forwards" and "Backwards" tends to be British style that have been deprecated by American style manuals (which drop the 's').
The Solunars page is rad! Wow, so many things. This will need some tweaking, e.g., PSSR doesn't go with the returns (it should be one of the three primary options on a quotidian page where it can also be paired with other options like mean/apparent, etc.). Seeing all the abbreviations alerts me that we need to really flesh out the Help section so people know what "Fagan's alphabet soup" is all about - and might want to slight tweak and juggle position. (Does the character set you're using reliably generate 1/2 and 1/4 characters? If so, I suggest substituting these for the D and the Q.) - Despite my opinion on relative value of the charts, I suggest that if KLR and 1/2KLR are in the middle section, then KSR and 1/2KSR should be there, too. - But, from a design perspective, I think that panel and its placement on the screen look great. (Maybe change "Supplemental Charts" to "Experimental Charts" so they aren't a priori ranked as lesser.)
Small stuff:
On chart input page, you only have time zone offset in hours and minutes. We need seconds (e.g., for LMT and LAT, though not for full standard zones).
Same page, Options section. Something isn't obvious about this. Maybe label it "Select Options" (or maybe "Options File"), change the second button to "Create Temp[orary]," etc. I'm guessing the currently selected (e.g., default) options file name automatically populate, which will simplify / change some of that.
Select Chart screen is definitely an improvement. I wonder, though, if "More Charts" shouldn't still go bottom center because it intuitively make sense as a vertical continuation of the list above it.
Chart Options page is a major improvement, and perhaps leaves room for expansion (I suspect that's in your calculations). "Use Vertex" is misleading since Vertex is always "used" (Vx Av shown) regardless of whether Vertex is listed in the angles table, isn't it? (Or did we agree it isn't. I forget.) Nodes could be slightly simplified as "True Node / Mean Node / No Node" (PS I just realized we should put True first so someone who doesn't know the difference likely picks it). "Don't Mark" should be a check box, since it is a choice with all the three variations before it, not an alternative. - There's room to add Paran orbs under the Mundane Aspect Orbs table (and perhaps put the aspect designations on the right edge). -- I don't see the Show Aspects row. -- I tend to think the "close / moderate / wide" explanations are needed since aspect classes are pretty unique to us (maybe fit it between the angles and aspects panels, since it applies to both?).
Midpoints panel is well organized. - One question: Is this a general (across all options) panel and not something that comes up for each Options file? I'm confused by picking natals and ingresses together and also picking solunars from the same spot. That's not needed if these are unique to each options file.
Ah, I see you already have a spot for Potential Parans. Maybe that's indeed the way to go - especially now. (If they prove themselves essential in the way that mundane aspects are, that probably should go on the earlier page; but I suppose the same argument could be made for PVPs.) In any case, it looks really good the way you have it.
Ingress page: Extremely usable. Personally, I'd want the Select All and Clear Selections buttons, I use them often. "All for one year" is well placed - will this also be greyed out if Forwards isn't selected? An alternative is to put the word "Forward" under the current line (making it "All selected for 1 year forward") which automatically checks the Forwards button also. -- Picky observation: "Forwards" and "Backwards" tends to be British style that have been deprecated by American style manuals (which drop the 's').
The Solunars page is rad! Wow, so many things. This will need some tweaking, e.g., PSSR doesn't go with the returns (it should be one of the three primary options on a quotidian page where it can also be paired with other options like mean/apparent, etc.). Seeing all the abbreviations alerts me that we need to really flesh out the Help section so people know what "Fagan's alphabet soup" is all about - and might want to slight tweak and juggle position. (Does the character set you're using reliably generate 1/2 and 1/4 characters? If so, I suggest substituting these for the D and the Q.) - Despite my opinion on relative value of the charts, I suggest that if KLR and 1/2KLR are in the middle section, then KSR and 1/2KSR should be there, too. - But, from a design perspective, I think that panel and its placement on the screen look great. (Maybe change "Supplemental Charts" to "Experimental Charts" so they aren't a priori ranked as lesser.)
Jim Eshelman
www.jeshelman.com
www.jeshelman.com