Including Polls
Once we’ve built a basic post form, it’s time to spice it up with some real features. Polls are one of them. They’re fun, they’re interactive, and they give users a quick way to engage — just tap and feel involved.
So, we’ll start by dissecting the current version (spoiler: it’s not great), and then move on to building a cleaner, smarter component.
Current issues
Let’s take a look at everything that's currently going wrong with the poll form. Brace yourself — it's a bit of a mess.
Borders overuse
There are too many borders — everything looks boxed-in and overly segmented, like the layout’s trying too hard to be organized.
Form title
Each form should ideally have a title. It’s not a hard rule, but it adds clarity — especially when multiple forms are stacked together.
Restricting input length
Using the maxlength attribute to limit how much users can type? Not great. Let them write what they want. If it's too long, validation will take care of it.
Two similar close buttons
Two close buttons, side by side. Confusing. Visually cluttered. Basically a UI version of "which wire do I cut?"
Removing options
Currently, users can’t remove poll options — even though it’s a totally valid scenario. Let them clean up their own mess.
Alignment and consistency
Inputs for days, hours, and minutes are all misaligned, inconsistent, and just generally sad-looking.
Inappropriate dropdowns
Dropdowns are fine… until you need to scroll through 60 options just to pick a number. That’s not exactly a modern experience.
Adding new options
Right now, the “Add new option” button appears next to the last input. But from a UX perspective, it’s more intuitive to place it below the list — that’s where users expect to add something new.
Fixing the issues
While the poll belongs to the post, visually it needs its own space. Right now, it just blends in — like someone taped a second form onto the first one.
Let’s break it out: move it outside the main content area, give it a background color instead of a border, and slap on a clear title. Also, we’ll add a Remove button for each option and move the "Add" button to the bottom — where it belongs.
With those changes, our first cleaned-up version might look like this:
Looks better already. But there’s still logic to handle — forms may look simple, but they rarely are.
We need to account for different states:
- If there are only two options, we hide the "remove" icon.
- If there are more than two, we show it next to each input.
And don't forget validation, hiding the "Add new option" button when users hit the max (4 options), and other little things that make forms feel polished.
Here’s a rough idea:
