Welcome

Welcome to Workshop 2 of Mobile Systems and Interaction.

Within this workshop, you'll learn the techniques to design software, design user interfaces and more importantly for this module, how to come up with an idea for you mobile application. By the end of this session you should have an idea of what kind of application you'll work on, and hopefully, have some design inspirations, which can be validated by your colleagues on the course, to work with while building your app after Reading Week.

This workshop will take you through the steps needed to come up with some ideas and start prototyping ideas into applications.

Generating Ideas

When thinking about what to build or coming up with an idea for a project, sometimes it can be a struggle. If I were to say to you come up with an idea right now you might start asking lots of questions about what kind of idea, how big should it be, when does it need to be built by. This can be a barrier to actually thinking outside of the box or just coming up with an idea quickly and sticking with it without validating that idea.

In this step we will introduce you to a technique called Crazy 8's to come up with an idea and validate that idea with your peers. This technique introduces the beautiful constraint of time to come up with an idea.

Crazy 8's - 10 mins

Crazy 8's is an exercise that we use in User Experience Design (UX) to come up with ideas quickly. Take 8 minutes and come up with 8 ideas! No idea is a bad one and you don't have time to second guess yourself! Don't worry about it being perfect, it's just important to get the idea on paper.

It's a fast-paced, fun exercise to get you thinking broadly about the problem you're trying to solve. We're going to do a few Crazy 8's sessions today to come up with ideas for our mobile apps

Grab a sheet of A4 paper and a pen! Fold that sheet of paper in half 4 times so you end up with 8 boxes. Don't write your name on this sheet of paper as we want this to remain anonymous but draw something on the sheet so you remember which one is yours.

When you're ready let the session leader know and when everybody is ready you'll have 8 minutes to come up with 8 ideas. This will be a timed session that we will carry out together.

3 .... 2 ..... 1...... LET'S GO

When the 8 minutes are up stick your sheet of paper in a pile at the end of the table.

Validating Ideas - 20 mins

Now comes the fun part. The session leader will now take the sheets of paper and mix them up. They'll hand you a sheet of paper and read through the ideas on the page. You'll have 2 minutes to read the ideas on the page.

Think deeply about the idea in front of you. Does it sound interesting? Can you imagine how the idea will work? Can you visualise what the idea would look like?

If you like an idea, place a tick at the top of the box containing the idea. If you don't like the idea then just move on to the next idea.

When you've finished, pick someone to swap with and do the process again. If you get your own sheet then swap with someone else.

We will do this 5 times. After the fifth iteration put the sheet at the top of the table and find your sheet.

You've now had someone validate your idea. Have a look at which idea came out on top and which ones your peers didn't like. Hopefully you now have a better idea what idea has worked and which ones haven't

App Store Research - 30 mins

Decide which platform you are going to build for (usually based on which phone you have) and spend the next 20 minutes doing some keyword searches on the App Store based on your idea. What have other people created? What did they name it? Look at the screenshots but do not install the app. This is your chance to make some notes, on a separate sheet of paper and note down the similarities of functions these apps provide. Note down anything that might help you find a gap in the market for your idea or anything you could do differently to make your app stand out.

After you've done this for 30 mins or so. Have a look at apps on your phone and look at how they're designed, notice how these apps take you on a journey through the app. Make notes on how they present data to the user and what interactions they use to make the user engage with the app.

All this information will be important in the next stage.

What Is Paper Prototyping?

Paper Prototyping is the process of drawing a Prototype of an idea, a software application or any type of interface you might be designing. The paper prototype will allow you to refine your design through multiple iterations without the burden of having to rebuild applications or spending time on features that you'll end up not using. It streamlines the building process and allows you to work out the kinks in the interface with actual users.

Starting your paper prototype

Start with an Android or iPhone Template, or even just a blank sheet of paper and start drawing out each screen of interaction. This will allow you to get a feel of what you need to build and what assets, images, you'll need to fetch or create. Plan out each screen and have buttons on the page to take you to the next page.

Once you've got a few screens finished, put them in front of one of your classmates and take them through the app. They'll naturally press on items on the page and you then can put the next screen in front of them. Get them to talk out loud on what they think they have to do next. If they get stuck then you know that there is something wrong with your design and you can easily fix it while it's on paper.

You should do this exercise a few times with different people to get an idea of what they think or any problems they face with the design. You must be as hands off in this process as you'll never be able to sit down with your user so you app must be intuitive and the hit points on each screen should be obvious.

Experiment with colour, with Font choices and images to make call to actions obvious. This is a hard process so it will take you a few iterations to get this right. Use the next few weeks to refine this design and get your app in a shape for people to use your application.

Once you're happy with the design then you can move to the implementation phase.

The End

Well that was a lot of information for one workshop. Well done for getting to the end. In the next session we will be looking at how to code in Dart and this will give you the foundation of starting to build your app in Flutter.

See you all at the next session.