HOME   FEED WIKI FORUM USERS TOP GROUPS   REGISTER LOGIN
Strip ID: 120 Created: 2022-06-03 17:32:10 Last reply: 2022-06-06 08:29:07 Comments: 18



ideas for layouts




Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-12 17:40:40
2022-06-03 17:32:10
#1
since theres some features desktop has but mobile is missing, ive been thinking of how the buttons for them could be laid out on the mobile ui ill probably make multiple, but right now ill start with the most basic that makes the least changes to the layout as it currently is for a frame of reference, this is what i see on my phone, and is also what im basic my design upon. hopefully this isnt very different from what others see ![1](https://i.imgur.com/8La3sNo.png "data on resolution is really inconsitent so i dont really know what to trust") (does everyone have the cancel and submit buttons squished like that or is that just me?) the most basic layout would remove the nuke button from the main view to make space, and add two new buttons ![2](https://i.imgur.com/y1x0FWZ.png "un-nuked?") the three squares button on the left side would be to bring up a window (similar to how the color picker pops up) to show the other panels in the strip (the new thread ui needs a character counter like comments do)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-03 17:35:04
#2
(side note in regard to the preview, the count starts [from zero rather than one](https://i.imgur.com/3n8Oh1n.png) for some reason, going by array index, im guessing?) the button next to that (in this instance showing the brush) would show your currently selected tool, and tapping on it would bring up a window with a selection of all the brushes, shapes, eyedropper, and whatever tools get added, and also the nuke button cause this particular layout lacks a better place for it

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-12 17:40:49
2022-06-03 18:02:34
#3
second variant is mostly the same buttons, just the nuke button brought back into the main ui (cause its cool), and stuff resized and shuffled around a little bit ![3](https://i.imgur.com/6u89vFb.png "") main thing is that i moved the text for the sliders from underneath the sliders to ontop them. the numberic value being ontop of the sliding piece, and the text is underneath if the value is 50, its on the left side. this ensures the sliding bit doesnt cover up the text

Peyo
2022-06-03 20:47:21
#4
yes the indexing is because of that (I never even noticed it before.. it's easy to change it to start from 1 if you want me to) I like the idea of the numbers on the slider (but due to the hacky nature of sliders this might be tricky though) the close and submit were squished on purpose (to make room.. strangely enough your phone is smaller on the Y axis yet seems to have more room than mine O_o) so far my idea was to change it so you have multiple pages and have two large arrows that switch between them (and also they would be cycled in a loop so going from page 3 would take you to 0 and vica versa) so like the close and submit would be on its own page, undo and redo on its own.. etc (only thing is i'm not sure if the palette should be on its own page or always visible)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-04 02:18:25
#5
i think the sliders and color selection should always be visible since they are probably the most used aspect of the interface however, thatd probably not make the arrows idea the most practical since youd only be able to fit a couple of buttons per "page" since theres quite a lot of tools unless you really cram them tight but all options are definitely worth experimenting with!

Peyo
2022-06-04 04:34:47
2022-06-04 04:32:37
#6
that is a valid concern.. hmm.. maybe a hybrid approach: there would be a main page (looking like #3) but only the color, size, alpha, undo, redo, tools and the two page arrows (in place of close and submit) and on this one the tool icon opens up a modal/overlay/menu with all the other painting tools (and changes to the current one selected) and so far two seperate pages (nuke, preview) and (close, submit) and the color and sizes would be only visible on this main page .. (to have more room) so the idea here is you would only leave the main if you want to do something special if i cant solve the numbers to be on the sliders maybe they could show up as some large text over everything but only when you change the size (like the volume on some TVs)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-04 07:19:40
#7
i like that idea! you could make the nuke page like a whole nuclear panel with like launch code post-its, random dials, etc also itll mean there will be plenty space to use in the future for any other special actions to be added

Peyo
2022-06-04 09:55:42
#8
ok, it should somewhat work now (apart from the range text over things and the color selector outside the window sometime that is) and I mean it's kind of useable now on my phone.. how is it on your end?

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-04 10:34:59
#9
it looks pretty good on my end! 4 pages does feel like a lot to scroll through, but it's definitely an improvement! i really like the way you approached the tool selection, its real slick

Peyo
2022-06-04 10:47:38
2022-06-04 10:44:47
#10
the plan is to eventually replace the nuke page with the layers (if I ever get to it) so 4 pages will be the absolute max (something like one nuke per layer.. and max 3 layers)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-12 17:42:02
2022-06-04 11:11:49
#11
that sounds good to me! while im here, im just gonna dump this here i dont want to make a new thread for every time i come up with layouts ![4](https://i.imgur.com/kOxbqR6.png "") the same could also apply on desktop, im just showing mobile as an example since its more pertinent especially since basically any title longer than two words completely wrecks the current formatting so basically the title has its own line + how many extra it needs on top of that with linebreaks, and then the number of posts within and timestamp are on their separate line, post number aligned left, timestamp aligned right

Peyo
2022-06-04 13:04:57
#12
sure (you should also be able to change the title if you want)

Peyo
2022-06-06 01:33:03
#13
trying to make the forum layout look like on your pic.. but so far with every attempt I only made it worse .. css is weird

Peyo
2022-06-06 02:17:58
2022-06-06 02:14:05
#14
@Carrot how about this new one? (mobile text should be smaller font also)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-06 08:22:12
2022-06-06 05:30:28
#15
it looks pretty good! the alternating colors is a nice touch

Peyo
2022-06-06 07:06:26
#16
ok I redesigned the comment title bar a bit too .. still not 100% about it but feels like an improvement compared to the last one (this doesn't show the last edit date though)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-06 08:26:31
2022-06-06 08:26:25
#17
that looks a lot better the best thing i can think of right now for showing last edit date would be to have an "edited" tag that shows the last edited date when tapped (probably only needs hover on desktop)

Carrot^abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqr new line
2022-06-06 08:29:07
#18
i see you also got the panels centered on the completed and underway pages on mobile 👍

GO UP
 2022-2026 Peyocay Inc. Complain here Privacy Policy