1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Templates for single question forms for mobile?

Discussion in 'HTML & Website Design' started by sarahk, Apr 9, 2017.

0
  1. #1
    I'm looking for templates for a really simple series of webpages each displaying a single question from a form and possibly a notes field

    For instance
    1. What is your name
    2. What is the number plate of the truck you are driving today
    3. How much petrol is in the tank (sliding scale)
    4. Is the load secure (yes/no)
    Each answer is saved but on completion of the final question the user is shown a thank you page.

    I've seen loads of templates for responsive forms but nothing for this type of simple question and answer stuff.

    Does anyone know of any templates?
     
    sarahk, Apr 9, 2017 IP
  2. HuggyStudios

    HuggyStudios Well-Known Member

    Messages:
    724
    Likes Received:
    20
    Best Answers:
    26
    Trophy Points:
    165
    #2
    By templates, you mean pre-made? Sounds like something that could be adapted from an existing template maybe but the requirements sounds bespoke. It would be pretty simple to create something like this in JS though.
     
    HuggyStudios, Apr 9, 2017 IP
  3. sarahk

    sarahk iTamer Staff

    Messages:
    28,500
    Likes Received:
    4,460
    Best Answers:
    123
    Trophy Points:
    665
    #3
    More on the styling side

    Something that makes a single yes/no question look really cool - I'm not too strong on the visual stuff. The coding is really simple but I'm trying to shortcut the whole design process.

    This form is going to be used by 3 people many times a day, 1 of our users has dyslexia and I need it to be pretty painless for all. They have a legal obligation to complete the form but it's generally considered to be a nightmare and therefore compliance is low. Waving a big stick isn't working because the boss is as bad as the workers so I need to make it super easy.
     
    sarahk, Apr 9, 2017 IP
  4. Nigel Lew

    Nigel Lew Notable Member

    Messages:
    4,642
    Likes Received:
    405
    Best Answers:
    21
    Trophy Points:
    295
    #4
    Is this a non wordpress gig?
     
    Nigel Lew, Apr 9, 2017 IP
  5. sarahk

    sarahk iTamer Staff

    Messages:
    28,500
    Likes Received:
    4,460
    Best Answers:
    123
    Trophy Points:
    665
    #5
    Yeah, haven't decided to use a platform for it yet. At the moment I can only see the "site" (1 form, one index of results, one page for the actual result) needing 3 tables (user, stock item, form results) at the most so there's not a lot of value in even using a CMS or framework.
     
    sarahk, Apr 9, 2017 IP
  6. Nigel Lew

    Nigel Lew Notable Member

    Messages:
    4,642
    Likes Received:
    405
    Best Answers:
    21
    Trophy Points:
    295
    #6
    Hmm. I thought I had bookmarked a few things when I got up. I will track them down.
    N.
     
    Nigel Lew, Apr 9, 2017 IP
  7. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,998
    Best Answers:
    253
    Trophy Points:
    515
    #7
    It SOUNDS like you have FOUR FIELDS, none of which even sound like they'd break 32 characters of data on a regular basis...

    So WHY in blazes are you making it HARDER TO USE by breaking it into four separate page?!? Just put your four bloody input on a page and be done with it...

    THOUGH, to simplify the workflow, the load secure being yes/no? Use those as your submits.

    <fieldset>
  <legend>Is the load secure?</legend>
  <button type="submit" name="secure" value="1">Yes</button>
  <button type="submit" name="secure" value="0">No</button>
</fieldset>
    Code (markup):
    Remember with submits, only the value of the one you click on is sent server side. Gas in tank is just a range slider input... is legacy browser support important for this? Modern you probably don't even need scripttardery... required and the new HTML 5 input types are your friend!

    Don't overthink it, one form, one page... DONE! That one question at a a time shit? THAT's what makes this type of thing painful. IF you can't fit one type="text", one type="number", one type="range", two type="submit", three <label> and one legend on your page to fit mobile at once -- I DON'T CARE HOW SMALL THE DISPLAY -- there's something horrifyingly WRONG.
     
    deathshadow, Apr 9, 2017 IP
  8. sarahk

    sarahk iTamer Staff

    Messages:
    28,500
    Likes Received:
    4,460
    Best Answers:
    123
    Trophy Points:
    665
    #8
    Oh @deathshadow, you missed the "for instance" :)

    The paper version is long and complex with teeny fonts and a nightmare to fill in which is why, a year after it being a requirement, not a single form has ever been completed. The fines for non-compliance are crippling but there's an attitude of "what they don't know..."

    I want to give multi choice icons for hazards etc and save the guys (one of which is my husband and he's nowhere near whipped!) having to type. Most of the time it'll be damn repetitive - tap, tap, done.

    I've found this but haven't checked it out thoroughly yet but I like it's lightweight approach enough to take it further.

    FWIW the phones are androids and iphones 4 & 5 - not huge but plenty big enough for our needs.
     
    sarahk, Apr 9, 2017 IP
  9. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #9
    Put the long, fine print redundant form text on its own page and the four or so form control input elements together on a single page. An input per page is humongously annoying. Don't do it. Since it is submitted multiple times per day, the less simple it is to use, the more aggravation you cause. Put all your efforts into making the form user friendly. Dummy up several forms and have your drivers try them out. First impressions from first attempts are important. Learn from them and build on their comments. Let them have skin in the game and they'll have more incentive to fill the damned things out.

    Don't worry about its looks beyond its being easy for everyone to read and there is nothing to distract the user.. It can be mud ugly, but if the users think it's easy and quick to use and they had a hand in designing it, you'll be queen of the ball.

    gary
     
    kk5st, Apr 10, 2017 IP
  10. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #10
    If I had to go through that rigamarole several times a day every day, I think I would start figuring out how to pencil whip it. That demo looks like the bullshit I went through last month when I changed carriers for my car insurance. I was on the verge of staying with my old, over-charging carrier to get me out of their question-at-a-time form hell.

    Please, Sarah, always put the user first, especially where an interaction is involved.

    gary
     
    kk5st, Apr 10, 2017 IP
  11. sarahk

    sarahk iTamer Staff

    Messages:
    28,500
    Likes Received:
    4,460
    Best Answers:
    123
    Trophy Points:
    665
    #11
    @kk5st i was trying to think of them! With the dyslexia issue and workman attitude I was trying to work out something that made it easy to complete. I know it would piss me off if I had to reach for my glasses just to do the paperwork when I arrived on site. If they don't like it, they won't use it so I'll get my feedback really quickly, but I'll try and get it right first time. I imagine that it will evolve as well - what seems good when you're mucking about might not seem so good when you're doing it for the 20th time that week.

    I'll run some options past the guys - atleast with such a small userbase it's easy to get 100% involvement.
     
    sarahk, Apr 10, 2017 IP