Questions about Slide-out Drawers
On mobile, I see some hamburger menus when activated have a screen appear from the left.
First off, is this called a "drawer"?
84 Replies
ive seen it being called an "off-screen canvas"
thats the term that bootstrap uses
MUI (React) calls it a Drawer (from Navigation drawer in Google Material Design) so maybe call it a menu drawer so you know what the content is?
Yeah, I think that is what I meant... "Menu Drawer"
So are there any problems / downsides to using a "menu drawer"?
There isn't one single, official name so I don't see any problem with that name "menu drawer". And most devs will know what you mean.
honestly, if you just call it a "slidy phone menu thingy", people will know
i would go with "menu drawer"
or whatever the tech stack you are using calls it
🍔 + menu + 🪗 (could not find a drawer icon 😂 )
🗄️
that has drawers
Ah yes!
🍔 📄 🪗 🗄️
should be close enough
That'll work
and it even has it's own soundtrack when you open and close
Yes, classic file cabinet drawer sound effect with a subtle accordion breath
the perfect cacophony
I thought those were french fries at first! 😛
So menu drawers are okay to use, right?
the term, yes
For those who have been opposed to me (potentially) using tabs on a hamburger menu... If you click on the hamburger icon and a menu drawer appears and it takes up the entire mobile screen, how is that really any different than if you clicked on the hamburger icon (or a button or a link) and a web page appeared?
I like the motion/action of side drawers, but once it is open it basically just looks like a new web page - unless it only covers part of the screen.
Just curious...
why don't you do what's best for your target audience?
Well, I think my ideas are the best - until I build it and get user feedback
Have never do mobile before, so this is all new to me
I feel like one of my gifts in life is organizing things, so I feel like my design ideas make sense, BUT I have gotten a fair amount of pushback from pelple online - many claiming that I am break some rules of mobile design
from your target audience?
Still haven't gotten a perfect solution yet, so I'm still kicking things around and aksingf ro feedback
perfect solution 🤣
do you want unicorns with that?
What do you mean?
there is no perfect solution: just fewer compromises
Don't be so literal...
you're too stuck in trying to get perfection
just make something, and let your target audience test it
if it sucks, iterate
if it doesn't suck, continue
Well, actually, as I see it, it's more like I'm trying my best to not fuck things up! 😉
Yeah, I guess
well, what's wrong about fucking things up?
at least it exists
and you get feedback from users who use your fucked up whatever thingy
Because I feel like this whole business is my last chance to make it
And so I feel immense pressure to get this right
you think facebook was good when it came out?
it was ass
And make things tand out enough that I can get some business from it all
the ui was pretty bleh, but it worked
I think Facebook is still the biggest piece-of-shit out there
but it exists
(Actually that is what terrifies me more... We live in a world of zombies and no one appreciates quality anymore. That being said, "Why am I trying to build something perfect?!")
And it has chanegd the world
for better or worse, yes
but you're missing the point: facebook exists
does your product exist?
for worse... 😉
no
you've been asking questions for about a month now
More like 2-3 months!
did you write any code or is it all still just concepts of plans?
I'm still stuck on my Information Architecture and design
(THis is like trying to cram 20,000 clowns into a VW bug!)
I think I am making progress, and know I need to wrap things up ASAP, but nailing this is 70% of the battle
i would say 10%
When I am in the mood, and my mojo is flowing - like last night - I work on it. But liek any art, it can't be rushed
even if you have the perfect plans, you will change them later
But that is the catch... Good architectures don't need to be changed or thrown out - they adapt to the changing world
Just like in construction, you build a foundation to last you a long time if not a lifetime
Lay a foundation for a 3 story house and you can built a one-story house and later expand
exactly: you need to at least build something
and if the one-story house isn't up to standards, it can be brought there or re-done
but at least you sleep in an house
I want to get out on the road and interview people for my business this summer, so I know I need to get my shit together - because I can't code and travel
True true
you really should test your designs too
even if it is a fugly prototype
True
just to test if it will feel decent or not
You mean like code so "I" can actually use it and see how it feels?
you and maybe others
My larger issue is that I am cover ing the world as a reporter and I can't keep up with the world
If I was just doing a website on knitting it would be done
Every day is a shot show in the news and things just keep mushrooming
My fear is missing out covering relevent news topics, but the reality is I have bitten off way to much
But I know what I want, and I feel like I am getting closer to wrapping up my IA, and then it's off to coding prototypes
then go for it
In what way?
I think my IA is progressing, and while I still fret about other criticisms I have had on my design ideas, I am mostly at a "fuck it" stage an will try out my ideas
But as you can see, I'm still searching for a silver bullet
all you will find is a rusty buckets full of bbs
Lost me
bb's?
you won't find a silver bullet that solves everything
got it
BB's
plastic rounds fired from "fake" weapons
yes
little plastic balls
no silver bullets
metal BB's when I was a kid
(killed many a squirrel in my town with those!)
sounds like slugs, not bbs
I had a pellet gun and a BB gun. Actually, fwiw, I would pour BB's into my pellet gun barrel, pump it up to like 10-12 and I'd have a kid's shotgun!
that sounds fun
It was deadly on squirrels and rabbits
never tried any of that
but the point is: none of those are silver bullets
It sucks being a perfectionist
But in my defense, this really is more a pragmatic approach of trying to build things so I can do the job of 5 people with one process and tool
Hard to fit a university on a smart phone, but I will find a way!
I assume (technically) that doing a side drawer menu is the same as doing a top-down drawer menu which slides into place from the top of the screen, right?
not really
What are the benefits of a side drawer menu versus a top-down drawer menu?
Hey sorry this is late but just wanted to comment on this to say don't put too much pressure on yourself. Everyone in this market is feeling the pressure but I believe you'll be okay and you'll go where life takes you! Creating a successful business is hard, especially in this industry, and your successes or failures do not define you.
That being said, you can have the worst UI and still sell well. Having good UI (from a business standpoint) is low on the list: focus on selling -- acquire clients and make them happy. Not to say you should have a bad website, since we are in the web dev industry and it's important to build trust and credibility, but going for perfection will only slow you down and hurt your business
P.S I've seen plenty of crappy websites from successful businesses
P.S I've seen plenty of crappy websites from successful businessesSAAAAAAAAAAAAAAAAAME!!!! holy fuck, you have absolutely no idea how shitty some of the sites i've worked on were, and they were making bank the last ones i've worked on have really outdated ui and looks and pretty meh performance, but still have a million unique visitors a day one's better for desktop and the other for mobile
Hey sorry this is late but just wanted to comment on this to say don't put too much pressure on yourself. Everyone in this market is feeling the pressure but I believe you'll be okay and you'll go where life takes you! Creating a successful business is hard, especially in this industry, and your successes or failures do not define you.@vince , THANK YOU for the "pep talk" - I needed that!!! (Pretty rare to get a "business"/"entrepreneur" perspective on things on Discord, so thanks!)
That being said, you can have the worst UI and still sell well. Having good UI (from a business standpoint) is low on the list: focus on selling -- acquire clients and make them happy. Not to say you should have a bad website, since we are in the web dev industry and it's important to build trust and credibilityNormally I would agree, but the thing is that I am building an online newspaper, so my Information Architecture IS my business-proposition!! (And I am targeting people who read the NYT and WSJ, so I want to not only "Wow!" them with how easy it is to find the information they want - or didn't know they needed - but to surpass what outlets like the NYT and WSJ offer.)
but going for perfection will only slow you down and hurt your businessI am guilty of this - to a point - but my focus is just on really NAILING my IA. The good news is that I feel like I am getting closer to wrapping it up. (Have been letting conversations from the last 3 months "percolate" in my brain, and feel like a solution is close!)
P.S I've seen plenty of crappy websites from successful businessesThis topic is what scares me the most... "Does anyone care about 'quality' anymore?" In a society that puts Mr. Beast on a pedestal, it worries me greatly if anyone will care about what I am building... Tell me more... Which is better for which?
the top one is better for a big screen in landscape
the drawer is better for a screen in portrait
But to clarify...
Not sure of the name, but if you are on mobile and you have a hamburger menu appear from the top of the screen is that really any different than if the menu is a "side drawer" and it appears from the left or right?
I mean to say, that once it is exposed, the hamburger menu takes up the same real-estate on the mobile screen, so to me whether it comes from the top (down) or slides in from the left or right seems more like an aesthetic thing.
Or is there more to it, and I am missing something?
have you tried to use a menu at the top on a phone?
it's absolutely horrible!
you need to have a thumb the size of an indicator to use it
or move the phone in a not-so-ergonomic way
there's a reason why people complain about the back button being all the way to the top
it's already bad to have the menu button there
now imagine the entire menu
Not a menu - a hamburger menu!
The NYT has their hamburger menu appear from the top of the screen, which is why I am investigating this as a possible option...
Home Page:
Top-loading Hamburger Menu:
i told you time and time again: im not your target audience
therefore, my opinions should be kinda worthless
and in my opinion, menus from the top on mobile suck
I understand that, but this isn't a "target audience" question.
Every hamburger menu icon I have ever seen is at the top of the screen, right?
So you have to go to the top of the screen on mobile and tap on that hamburger icon ALWAYS, right?
And whether the hamburger menu appears from the top sliding down, or from the left sliding right - either scenario does not impact where you have to tap to open the hamburger menu, right?
So it seems that this is more of an aesthetic thing - unless I am missing some UI thing?
Just saying...
it impacts how you use the menu
one tap, while horrible (in my opinion) is easy to manage
now, having to scrounge through the menu to find what you need, gets really tiring at the top (in my opinion)
Trying to understand your concerns...
How the hamburger menu slides onto the screen doesn't impact how you use the hamburger menu, right?
Also, in my case, the hamburger menu should fit on one screen - but even if it didn't, what does that have to do with whether it slides in fromt he top of the screen or the side of the screen?
(It almost soudns like you think hamburger menus should be banished on mobile?!) 🙂
how it slides is visual
the position of the content requires physical effort on mobile
Right, so the final resting place of my proposed hamburger menu (i.e. open state) is the same in either scenario. And the content within the hamburger menu is the smae regardless of how thigs slide in.
That being said, do you have a preference in how the hamburger menu slides in?
no
i just dont want to have to wait 3-5 seconds because of useless animations before i use the option i want
But a slide out using Javascript should be quicker than loading a static page (e.g. a menu page), right?
yes, it should