@TomFulp how come on the mobile version, the audio page just keeps showing a loading screen? It never finishes loading the song and makes them unplayable.

I'm on a Nokia Lumia 635, a Windows Phone.
I can't seem to vote on any submission for some reason. I could hover my finger over the star meter and I wouldn't get any highlights within the icons. It's impossible to vote for now.

Probably making a menu link to the portal on the mobile app. Every time I go and use my phone I have to look it up to use the portal.

At 11/1/18 06:01 PM, vvaster wrote: Probably making a menu link to the portal on the mobile app. Every time I go and use my phone I have to look it up to use the portal.

That would be very helpful. The only problem I ever run into is that sometimes movies will not play.

I'm not sure if it's been suggested, but rather than the header being the way it is, (like the "[games] movies [audio]..."
It would probably be better to have those in an expandable menu on the side, everything (atleast in the community forums) just seems a bit to bulky for mobile use as well if you get what I mean, and I think removing that bit might help with the space.

Was surprised to find out that such a popular website, does not have an android app to download. Would be great to have one.

Not mobile specific, but comic illustrators might want to "thread" the different pages of their comic together to make it easier for viewers to tag along. I know playlists exist, but allowing for direct navigation in the page would be great (or better yet, just display the next image in the series for the art portal).

Also I think each users feed would be improved by having richer media content. Display art and embed movies, embed audio (like soundcloud), maybe let games hang out in the feed longer? Today, if a news post has an image, that image will show up in the feed, but anything from any portal is minimized to that shortform object thingy. Ideally, news posts should be capped if they're too long, and portal submittions should be fully displayed.

At 12/6/18 04:55 PM, Havegum wrote: Not mobile specific, but comic illustrators might want to "thread" the different pages of their comic together to make it easier for viewers to tag along. I know playlists exist, but allowing for direct navigation in the page would be great (or better yet, just display the next image in the series for the art portal).

Hoping to get a good solution for this going after some other items are checked off the list.

Also I think each users feed would be improved by having richer media content. Display art and embed movies, embed audio (like soundcloud), maybe let games hang out in the feed longer? Today, if a news post has an image, that image will show up in the feed, but anything from any portal is minimized to that shortform object thingy. Ideally, news posts should be capped if they're too long, and portal submittions should be fully displayed.

We plan to get art and movies directly into the feed asap. You can already play music in the feed by clicking the thumbnail but it IS a bit secret... Your mockup for that looks cool.

For the community page I would consider adding an affordance to tell which forum a post belongs to. In the case of creator forums they could even be color coded to match their portal.

It also seems to me that the "jump to forum" button serves the same purpose as the "All Forums" button. Only with the former option users don't need to navigate to a new page to find their forum. Maybe just remove it? The "jump to forum" button also currently displays a radio input modal box when I press it on my screen. Perhaps consider having a menu enter the page from the right with links to each forum. It would make the navigation more consistent as that's what happens when you interact with the hamburger menu.

For the chat and radio I think you can have some pretty large buttons and save space on the page at the same time. By getting rid of the header (the links are self explanatory), they're easier to find and click.

In general I think the headers often are kind of redundant and take up a lot of space on the screen. For instance, if someone replies to my post, my feed will have a header for instance saying "radiodark replied to your post.", immediately followed by "radiodark posted in Art Forum Lounge -- about 16 hours ago". Perhaps consider grouping similar information and removing redundant information. Screen space is limited, especially on phones!

There are also lots of separation bars, large paddings and margins. I think a bunch of these can be tightened or in some cases entirely removed without too much trouble.

I'm not sure what order is the best for the different modules, for people that regularly use the chat and radio, perhaps they should be closer to the top so they don't have to scroll through the page to find them? Then again if a lot of people use it, maybe just have it in the hamburger menu?

I'm also not sure what's the most appropriate information to display to the right in the "From the Forums ..." section. My intuition tells me I'm often more curious who's the last poster but that might not be the case for everyone.

At 12/7/18 03:20 PM, Havegum wrote: For the community page I would consider adding an affordance to tell which forum a post belongs to. In the case of creator forums they could even be color coded to match their portal.

Color coding could be fun, not sure what the best way to do that on the summary screen might be or if it would get too rainbow looking.

It also seems to me that the "jump to forum" button serves the same purpose as the "All Forums" button. Only with the former option users don't need to navigate to a new page to find their forum. Maybe just remove it? The "jump to forum" button also currently displays a radio input modal box when I press it on my screen. Perhaps consider having a menu enter the page from the right with links to each forum. It would make the navigation more consistent as that's what happens when you interact with the hamburger menu.

It would be best to ditch traditional dropdowns on mobile in a number of places. The "All Forums" page is more descriptive but maybe we could just keep that link on desktop, for the sake of simplifying mobile and having a slide in / lightbox forum list.

For the chat and radio I think you can have some pretty large buttons and save space on the page at the same time. By getting rid of the header (the links are self explanatory), they're easier to find and click.

I love this mock-up and placement. You've been making great mock-ups so far, I really appreciate it! I know Bren would appreciate links like these too for chat and radio.

In general I think the headers often are kind of redundant and take up a lot of space on the screen. For instance, if someone replies to my post, my feed will have a header for instance saying "radiodark replied to your post.", immediately followed by "radiodark posted in Art Forum Lounge -- about 16 hours ago". Perhaps consider grouping similar information and removing redundant information. Screen space is limited, especially on phones!

There are also lots of separation bars, large paddings and margins. I think a bunch of these can be tightened or in some cases entirely removed without too much trouble.

YES YES YES. This has been on my mind for a long time and there are some changes I have in mind and others that I've still struggled with layout out... The headers are sometimes redundant and sometimes useful, so it comes down to getting things set up in a consistent way for all the events.

I do think all the headers are distracting and I want to do as much as possible to make the feed feel "calm and relaxing." I also want to ditch the Facebook and Twitter links because I'm pretty sure no one uses them and we ultimately hope to have a reblog feature to share things within NG (and that was BEFORE the Tumblr migration started, now it's a big request item).

I'm also not sure what's the most appropriate information to display to the right in the "From the Forums ..." section. My intuition tells me I'm often more curious who's the last poster but that might not be the case for everyone.

This has been a tough one... Sometimes someone comes through and replies to every post, at which point the "Latest Post" would be the same person on each one... It might be the most relevant though, especially if you are checking frequently and see new faces pop in.

Thanks again for the mockups, I really like what you've been coming up with!

At 11/26/18 02:22 AM, Nick8akon wrote: I'm not sure if it's been suggested, but rather than the header being the way it is, (like the "[games] movies [audio]..."
It would probably be better to have those in an expandable menu on the side, everything (atleast in the community forums) just seems a bit to bulky for mobile use as well if you get what I mean, and I think removing that bit might help with the space.

That would be a great change. Making things much more flexible and customized.

At 12/4/18 10:08 AM, Balkazzaar wrote: Was surprised to find out that such a popular website, does not have an android app to download. Would be great to have one.

There have been many conversations about about aps.

At 12/6/18 04:55 PM, Havegum wrote: Not mobile specific, but comic illustrators might want to "thread" the different pages of their comic together to make it easier for viewers to tag along. I know playlists exist, but allowing for direct navigation in the page would be great (or better yet, just display the next image in the series for the art portal).

Threading or altering it would be nice. That is a nice idea.

Also I think each users feed would be improved by having richer media content.

Richer media content could be helpful

Display art and embed movies, embed audio (like soundcloud), maybe let games hang out in the feed longer? Today, if a news post has an image, that image will show up in the feed, but anything from any portal is minimized to that shortform object thingy. Ideally, news posts should be capped if they're too long, and portal submittions should be fully displayed.

Another new and interesting idea. Make sure that you submit it.

At 12/7/18 03:33 PM, TomFulp wrote:

At 12/7/18 03:20 PM, Havegum wrote: In general I think the headers often are kind of redundant and take up a lot of space on the screen. [...]

YES YES YES. This has been on my mind for a long time and there are some changes I have in mind and others that I've still struggled with layout out... The headers are sometimes redundant and sometimes useful, so it comes down to getting things set up in a consistent way for all the events.

I do think all the headers are distracting and I want to do as much as possible to make the feed feel "calm and relaxing." I also want to ditch the Facebook and Twitter links because I'm pretty sure no one uses them and we ultimately hope to have a reblog feature to share things within NG (and that was BEFORE the Tumblr migration started, now it's a big request item).

I think I might start by getting rid of headers on all things categorized "Interactions" and "Friend Activity". These generally already have the information needed inside the module, and things that don't really need to take up too much space in the feed when the user is not engaging with it (like pressing expand). Additionally I think it makes sense to let headers in the feed be primarily for portal submittions.

You can just have the settings cogwheel and let the text break to not interfere with it.

For reviews maybe you don't need the icon for the item being reviewed? In that case the user is the one that uploaded it so I think for most cases the submittion would be recognizeable by the name alone.

In the case of people responding to your comment on their post, maybe have your post in the same style used for quotes elsewhere on the site. It makes sense because in the response, your comment is what's being quoted. I'd replace the cog with an X icon since delete is the only available action (definitely add a confirmation dialogue though).

At 12/7/18 05:51 PM, Havegum wrote: In the case of people responding to your comment on their post, maybe have your post in the same style used for quotes elsewhere on the site. It makes sense because in the response, your comment is what's being quoted. I'd replace the cog with an X icon since delete is the only available action (definitely add a confirmation dialogue though).

Your knock-out buttons look good, itd be good to move to that direction, opens up the space and feels less windows Vista

At 12/7/18 03:33 PM, TomFulp wrote:

At 12/7/18 03:20 PM, Havegum wrote: [Color forum hints]

Color coding could be fun, not sure what the best way to do that on the summary screen might be or if it would get too rainbow looking.

Do you think it looks to much like a rainbow in the mockup? I think it works fine – having the text just grey like "general" and "clubs & crews" is displayed in the mockup also works. Either way I think having some way to tell what forum you're about to enter would be better, and better is good!
 
 
I also think the navigation bar at the top could be improved with some not too large changes. First of all, the order of icons should match in both the desktop and mobile. Second, I'd reduce the icons' size a bit and add some text to indicate what they do. I would definitely also add a :hover style to the elements to make it clear they are clickable.

For mobile, I'd have the searchbar appear inline inside the navbar. The design is more cohesive if the same buttons does the same thing, and by having the searchbar extend from the button, the users can see the interface react more clearly from the point of interaction.

The other issue that's gonna take more work is ensuring the same icons mean the same thing on both platforms. Pressing the user icon on desktop opens a drop down menu, when pressing it on mobile a similar menu slides in from the left. Maybe consider downward slide for mobile? The colors of the links are also different – unless there's a reason I'm missing I'd just let them be the same color. More importantly, different items appear in the menus. The difference in items is: Your Profile, Your file Dump, Interactions, and Requests. Your profile seems redundant as you can just press your own name to get there (though I'd add a :hover style here too). It seems to me that your file dump should be accessible from mobile too, so I'd add that there. Interactions already has its own icon on the navbar so I'd remove that from the list. Requests seems like it should be accessible from mobile, so I'd add it the mobile layout as well. Private Messages already has its own button on the navbar so I'd consider removing that from the list. I'd consider adding the spacing above the log-out button for mobile as well.

The notification-icon on desktop opens a lightbox feed of the notifications on the current page. On mobile it navigates to a new page. The message icon opens a drop-down feed with the last messages on desktop. On mobile it navigates to a new page.

Oh, and when you press the hamburger icon on "../social/feeds", the menu only displays "< Social" and "Your Feed >" instead of the full list (Interactions, Fav. artists, Forum activity, friend activity, feed settings)

I was toying around with how using css grid could make the ng layout more fluid and future-forward.
I'm thinking out loud but it could even go bigger as well, like imagine having a wide screen monitor or on a giant touch screen and the layout becomes super wide and chunky and isnt just framed inside the 960 grid anymore.

http://luiscastanon.com/ng/newgrounds.html

At 12/9/18 10:51 AM, Havegum wrote:

At 12/7/18 03:33 PM, TomFulp wrote:

At 12/7/18 03:20 PM, Havegum wrote: [Color forum hints]

Color coding could be fun, not sure what the best way to do that on the summary screen might be or if it would get too rainbow looking.

Do you think it looks to much like a rainbow in the mockup? I think it works fine – having the text just grey like "general" and "clubs & crews" is displayed in the mockup also works. Either way I think having some way to tell what forum you're about to enter would be better, and better is good!

I think I misread before, I thought you were suggesting color coding each post in the Community News summary, to represent which forum it is in.. So I was picturing a lot of alternating colors in there.

I also think the navigation bar at the top could be improved with some not too large changes. First of all, the order of icons should match in both the desktop and mobile. Second, I'd reduce the icons' size a bit and add some text to indicate what they do. I would definitely also add a :hover style to the elements to make it clear they are clickable.

I agree the icon order should be the same, mobile was intended to get updated when we added our new search but it never did. As for adding the text descriptions next to the icons, I assume a lot now that people are familiar with the icons because they are pretty universal on big sites. Also in portrait mode on mobile it wouldn't fit. That mock-up does look nice though so it's still tempting.

For mobile, I'd have the searchbar appear inline inside the navbar. The design is more cohesive if the same buttons does the same thing, and by having the searchbar extend from the button, the users can see the interface react more clearly from the point of interaction.

Same as above - the intent was to open the search bar in the header space, vs under it, but that wasn't updated yet either. Also your mock-up works well on an iPad or horizontal phone screen but on portrait mode of a phone, search bar likely needs to full the whole header when it appears, with an X button to close (had found a lot of examples of this on sites before but haven't look around in more recent months to see if that's been evolving).

The other issue that's gonna take more work is ensuring the same icons mean the same thing on both platforms. Pressing the user icon on desktop opens a drop down menu, when pressing it on mobile a similar menu slides in from the left. Maybe consider downward slide for mobile? The colors of the links are also different – unless there's a reason I'm missing I'd just let them be the same color. More importantly, different items appear in the menus. The difference in items is: Your Profile, Your file Dump, Interactions, and Requests. Your profile seems redundant as you can just press your own name to get there (though I'd add a :hover style here too). It seems to me that your file dump should be accessible from mobile too, so I'd add that there. Interactions already has its own icon on the navbar so I'd remove that from the list. Requests seems like it should be accessible from mobile, so I'd add it the mobile layout as well. Private Messages already has its own button on the navbar so I'd consider removing that from the list. I'd consider adding the spacing above the log-out button for mobile as well.

Lotsa good details here!

The notification-icon on desktop opens a lightbox feed of the notifications on the current page. On mobile it navigates to a new page. The message icon opens a drop-down feed with the last messages on desktop. On mobile it navigates to a new page.

This is due to the lightbox on mobile having worse scroll performance PLUS it has an empty margin on each side so you can tap to close, making everything inside a little more squished. Going to a dedicate page currently works better for smooth scrolling / full width.

Oh, and when you press the hamburger icon on "../social/feeds", the menu only displays "< Social" and "Your Feed >" instead of the full list (Interactions, Fav. artists, Forum activity, friend activity, feed settings)

That dang hamburger menu.

At 12/9/18 06:22 PM, TomFulp wrote:

[Labeling next to icons]

[...] I assume a lot now that people are familiar with the icons because they are pretty universal on big sites. [...]

I'd recommend including them either way to remove any ambiguity. You can add media queries to ensure the labels are only displayed on devices with enough room. The icons could also comfortably be reduced to 75% of their current sizes, the labels will allow them to be clickable on touch devices.

[Inline search bar]

[...] search bar likely needs to full the whole header when it appears, with an X button to close

I'd consider spelling out "Cancel" here as well – notifications are the devil!

[Notifications on phone vs. desktop]

This is due to the lightbox on mobile having worse scroll performance PLUS it has an empty margin on each side so you can tap to close, making everything inside a little more squished. Going to a dedicate page currently works better for smooth scrolling / full width.

Ah, that makes sense. Maaaybe consider the icon triggering a drop down list of the most recent notifications instead (like it does with messages on desktop). That way the interaction could be the same on both platforms as well as between items.

Oh, and this submittion

• 

  Encounter

  by MLeth

  Illustration

  2,451 Views

  (Everyone)

... inspired me to put together something that I think would make artists happy. I just pulled the artwork out of the column, let it take up the full width of the page, and set a cap on its height. The artwork title and buttons could go in the "Authors Comments". This ensures tall images don't take over the screen, small images don't take more height than they need, and wide images gets displayed in all their glory!

Oh, and as a bonus, artist information and author comments could always end up right next to each other!

At 12/10/18 08:52 AM, Havegum wrote: Oh, and this submittion
http://www.newgrounds.com/art/view/mleth/encounter
... inspired me to put together something that I think would make artists happy. I just pulled the artwork out of the column, let it take up the full width of the page, and set a cap on its height. The artwork title and buttons could go in the "Authors Comments". This ensures tall images don't take over the screen, small images don't take more height than they need, and wide images gets displayed in all their glory!

Oh, and as a bonus, artist information and author comments could always end up right next to each other!

That does look great, ESPECIALLY for landscape art that benefits from the extra width. It's also a lot like what I'm hoping to do on video pages in the coming year - breaking the video out of the layout and displaying it at a larger size.

At 12/10/18 08:52 AM, Havegum wrote: Oh, and this submittion
http://www.newgrounds.com/art/view/mleth/encounter
... inspired me to put together something that I think would make artists happy. I just pulled the artwork out of the column, let it take up the full width of the page, and set a cap on its height. The artwork title and buttons could go in the "Authors Comments". This ensures tall images don't take over the screen, small images don't take more height than they need, and wide images gets displayed in all their glory!

Oh, and as a bonus, artist information and author comments could always end up right next to each other!

On quick realization here though... It goes in conflict with a current plan for how we want to do multi-image posting.

Right now the plan is to actually REMOVE the Author Commentary header bar, so the commentary appears directly below the art in the same box. This way, if someone has additional pictures like alts, wips or comic panels, they can seamless appear below the primary piece (or with commentary along the way). Breaking the primary piece out would probably be fine in cases like alts and wips, but for comics it might not be as desired - unless the primary pic is always like some dedicated title page - because I imagine a lot of comics just want a seamless column of panels. It could all be dependent on whether the primary art piece is wider vs tall, maybe.

At 12/10/18 09:46 AM, TomFulp wrote: On quick realization here though... It goes in conflict with a current plan for how we want to do multi-image posting.

Maybe they could all be combined? Allow to upload multiple artworks, and multiple alternatives for each of those like so?:

At 12/10/18 11:03 AM, Havegum wrote:

At 12/10/18 09:46 AM, TomFulp wrote: On quick realization here though... It goes in conflict with a current plan for how we want to do multi-image posting.

Maybe they could all be combined? Allow to upload multiple artworks, and multiple alternatives for each of those like so?:

that looks super ugly halvard.

what about if they stack like a layer cake instead

Is there a way I can swipe from image to image? Having to go back and click on the next one is kinda a pain.

Is it possible to have a button to click to reveal the rating bar? I tested mobile out today for a friend who likes mobile versions, and while trying to scroll after looking at a comment left on one of my works I accidentally rated my own work. It was pretty awkward. I'm not sure how to undo that or if it messes anything up.

At 12/7/18 05:51 PM, Havegum wrote:

At 12/7/18 03:33 PM, TomFulp wrote: Stuff

Just throwing in my 2 cents on the whole header debacle. I think it has less to do with the headers, and more to do with simple grouping.

At 12/8/18 06:58 AM, Luis wrote:

At 12/7/18 05:51 PM, Havegum wrote: In the case of people responding to your comment on their post, maybe have your post in the same style used for quotes elsewhere on the site.

You could be very useful.

Your knock-out buttons look good, itd be good to move to that direction, opens up the space and feels less windows Vista

Being able to change up the direction would be helpful.

At 12/9/18 10:51 AM, Havegum wrote:  
I also think the navigation bar at the top could be improved with some not too large changes. First of all, the order of icons should match in both the desktop and mobile. Second, I'd reduce the icons' size a bit

I would be okay with the navigation bar at the top.

For mobile, I'd have the searchbar appear inline inside the navbar. The design is more cohesive if the same buttons does the same thing, and by having the searchbar extend from the button, the users can see the interface react more clearly from the point of interaction.

Yes, mobile should be similar but different as well.

At 12/9/18 11:03 AM, Luis wrote: I was toying around with how using css grid could make the ng layout more fluid and future-forward.
I'm thinking out loud but it could even go bigger as well, like imagine having a wide screen monitor or on a giant touch screen and the layout becomes super wide and chunky and isnt just framed inside the 960 grid anymore.

If it was larger, and could increase to size, that would be great.

@Havegum @test-object @Luis @IvanAlmighty

This isn't about the mobile layout (yet) but have been tinkering with some ideas for search.

So one of the goals is that when you click a tag on a content view page (for example, the "robots" tag on a piece of robot art), it goes to our central search instead of the old tag results page.

This mock-up does a few things to search:

1) Breaks a "Tags Only" search out of the Advanced options so it's more clear that it exists.

2) Has On/Off switch for Tags Only and Advanced Options, so when one is enabled, you can continue to search while these rules stay in place - search other content categories, try new search terms, etc.

3) Has a layout toggle so you can choose between list or grid. Grid would be better once we generate larger thumbnails and we could even have a layout option for full art pieces in the results.

Any immediate thoughts on how this could be done better?

At 12/17/18 03:43 PM, TomFulp wrote: stuff

Let me start by saying I would love a grid toggle. No complaints there.

For the tags, though, I think you might be tunnel-visioning on them and missing the bigger picture. They are part of a search engine and shouldn't be requiring a big separate button. If you condense the "Sort By" into a dropdown, a "Match Against" toggle could work like the ETMA system, so the user can filter whichever way they want. Tags would be easily accessible, albeit less noticeable.

At 12/18/18 01:37 AM, test-object wrote: For the tags, though, I think you might be tunnel-visioning on them and missing the bigger picture. They are part of a search engine and shouldn't be requiring a big separate button. If you condense the "Sort By" into a dropdown, a "Match Against" toggle could work like the ETMA system, so the user can filter whichever way they want. Tags would be easily accessible, albeit less noticeable.

I really like this idea in principle, but - there are times when I want to specify terms and then drill down by author too (i.e. enter them separately).

I've mentioned this to Tom, but I feel as though there should be a way of getting into advanced options from the search bar itself - maybe some cog icon next to the magnifying glass that opens an overlay when clicked/pressed with all your options. When you search with those options enabled, you'd see some indication that you've deviated from the defaults somehow. So whatever page you're on, you can load up the search bar with all the options you want to search by and then have at it.

In your example, you could switch the author button for an actual input I guess?

Then there's the case of figuring out how all of this would work on mobile.

At 12/18/18 10:46 AM, liljim wrote:

At 12/18/18 01:37 AM, test-object wrote: For the tags, though, I think you might be tunnel-visioning on them and missing the bigger picture. They are part of a search engine and shouldn't be requiring a big separate button. If you condense the "Sort By" into a dropdown, a "Match Against" toggle could work like the ETMA system, so the user can filter whichever way they want. Tags would be easily accessible, albeit less noticeable.

I really like this idea in principle, but - there are times when I want to specify terms and then drill down by author too (i.e. enter them separately).

I've mentioned this to Tom, but I feel as though there should be a way of getting into advanced options from the search bar itself - maybe some cog icon next to the magnifying glass that opens an overlay when clicked/pressed with all your options. When you search with those options enabled, you'd see some indication that you've deviated from the defaults somehow. So whatever page you're on, you can load up the search bar with all the options you want to search by and then have at it.

In your example, you could switch the author button for an actual input I guess?

Then there's the case of figuring out how all of this would work on mobile.

This picture is a little out of context but I'll drop it here just to give people more things to ponder.

This was a concept for showing specific settings IN the search bar. It risks getting claustrophobic and everything has less space on mobile. Having a gear icon that lights up when Advanced options are in use would work decent but I feel like people would still get confused. My main use case is when someone clicks a tag and is taken to a tag results page - I want it to be ultra-clear to them that they are in "tag results mode", where a glowing gear in the search bar wouldn't suffice.

At 12/10/18 08:52 AM, Havegum wrote:

At 12/9/18 06:22 PM, TomFulp wrote:

[Labeling next to icons]

[...] I assume a lot now that people are familiar with the icons because they are pretty universal on big sites. [...]

That is true but you can never assume. lol

Oh, and this submittion
http://www.newgrounds.com/art/view/mleth/encounter
... inspired me to put together something that I think would make artists happy.

That sis help make the artists happy.

The artwork title and buttons could go in the "Authors Comments". This ensures tall images don't take over the screen, small images don't take more height than they need,

Having more options works out well

Oh, and as a bonus, artist information and author comments could always end up right next to each other!

Nice idea.

At 12/10/18 11:03 AM, Havegum wrote: Maybe they could all be combined? Allow to upload multiple artworks, and multiple alternatives for each of those like so?:

That combination would be a useful thing.

At 12/10/18 04:23 PM, Luis wrote: that looks super ugly halvard.
what about if they stack like a layer cake instead

That is not a bad idea at all.