Designing process

Designing Process

In class: discussed in groups the 7 questions as a pre-hand assignment

30/04/21 First class

In-class assignment

I would like to create another interface that would help my main interface, the mobile app, be exposed and inform as many of my target users as possible. This billboard is an inspiration from the 105 Interfaces Collections which was assigned to us to get a better understanding of interfaces around us. The use of an electronic billboard in public places is a very efficient way of advertising especially for products that are releasing for the good of the public. It is an easy way of getting the message of your product across fast and visually, simple to look at. This is why I created a mock-up of what my app would look like in an electronic billboard advertisement. Then I placed it in different public settings where most of my target user group would appear.

In class:

Prepare for next class:

-Continue to develop your sketches. These sketches should give insight in your considerations for your choice of medium, level and type of interaction, the content you are using, visual design elements and visual language. Prepare at least 10 sketches, these should include: sketches for the choice of medium, sketches for the type of interaction, sketches for your visual choices.
-To discuss your sketches in the next class make sure to include everything in your Hotglue website and include a concise overview of your main conclusions from your research that informed these sketches.

- develop the app more in terms of how it connects to the content

-remember your target group

- do the families match up with each other and then meet at a nature route?

- app+ advertisement should be clear (design the most important content)

-what are the expats getting out of this? a connection?

Prepare for next class:

Design at least three options for how you would like to apply typography in your design, keeping in mind your specific user group. Which typefaces are you using and why? Which hierarchy of information are you designing and why? How can typography contribute to your navigation and interaction?

In small groups we will discuss your first sketches and help each-other to make decisions on how to continue with your design and turn it into a testeable prototype. At the end of the class you should know which medium, content and type of interaction to use, and to have a sense of how to further explore and develop your visual language.

10/05/2021

Do 3 different quick experiments of different media-forms (online, offline or hybrid) and ways of how interaction with the user connects to them. Experiment/try-out what this interactivity means. Analyze: what are you asking of your users? (inform, shock, question, etc.)

11/05/21

In class:

Presentation about different examples and inspiration on typography and text-hierarchy. We will do a series of exercises on typography to practice working with fonts in relation to text-hierarchy. These exercises will generate insights for you to apply in your design.

These are the first 3 sketches I did with considering the typography of the logo of my app: Natural Expats. I wanted to create a fun and vibrant design for the logo because that is what will be on the advertisement of the product (the electronic billboard). It should catch the attention of the expats and the name of the app should be big and visible.

These are the in-class exercises:

-Pick one sketch and design it in an opposite way (small too big, light too dark, etc.)
-Pick another sketch and apply a font of an assigned classmate and apply it to your design. (Karo, Helvetica, a combination of bigger font size with light and smaller font size with bold, and size 60, 40, and 20)

-Take two fonts from your range of sketches and re-design the hierarchy of the information in your design.
-Reflect in your research groups on the different experiments. What works or does not work and why?

Feedback: The "Natural" could still be played with in terms of its angle just like the "Expats" is in a diagonal position. It could also be smaller than "Expats" to make the contrast more drastic.

These are some final sketches of my previous work which was edited. Based on the exercise and feedback from my peers, this is where some of my first ideas led me.

17-21 May DD Week

This is the very first sketch of my design that I did on my concept of the "Meet & Greet" mobile app. I wanted to start off with a paper prototype based on the information I received from Arjen's presentation on the different ways to test our prototypes. Paper prototyping can be extremely helpful during the early-stage conceptualizing — when you need to explore a variety of different concepts and choose the one that will be used. The paper prototype allows quick visualization and tests of various ideas. It was overall, easier for me to make quick changes along the way and it was easier to see the different functions my app had to do. It showed me what is really important to have in your app and what isn't necessary.

Prepare during DD Week for next class:

Apply the insights from the exercises on typography and hierarchy to your designs.
Based on the sketches and experiments so far develop a prototype you can test and do the actual testing during the DD week. Document the test, results and user feedback in your Hotglue. What conclusions can you make based on these results? How will you adjust your design?

on testing the paper prototype can be found in the "Testing; Documentation of a Prototype" (11/05/21) click

here

to see the feedback!

After the feedback on the paper prototype and changing my design to a more high-fidelity prototype, I moved on to Adobe design. I wasn't familiar with the software but after a quick tutorial, I managed to turn my sketch of the paper prototype into a good first design of what I envisioned. I wanted to focus on the color palette and the visuals such as the buttons, and the mock-up of its functionality. The concept of this app was to create an accurate match up for both the family and a nature route provided by Staatsbosbeheer. The user could create a profile based on their family's interest aswell as their own, and the app would analyze the data and then help them find the best nature route based on their choices. Once they have completed a nature route, they could give it a review by uploading a photo and sharing it on their social media.

Paper prototype

Design #1 Adobe XD + Design #1 for advertisement of the App (DD Week)

to see the feedback!

Design #2 Adobe XD

After the feedback from testing and from the tutors on my first mock-up design for my app, I decided to completely change the purpose of the app and re-focus on my research. I ended up pulling apart the most important aspects of my target user group and provide each of them with their needs. Below I added a sketch of my new ideas for making my app even more exclusive to my target user group. After doing this diagram, it helped me to remember who I am really designing for and how to achieve each and everyone's needs.

The purpose of this new design and concept for my app is to appeal to all of the user targets' needs.

Expat families:
>>adults: every 300m or so, a fact will pop up about the Netherlands as well as a fact about Dutch nature. This will help the new family be prepared of integrating into the Dutch culture and know what to expect.
>>children: they can treat the dutch nature routes as a "finding things game" they have a checklist built-in in the app where they can take photos with their parent's mobile phone and then receive "badges" for every wildlife they log in.

The fact they have worked in developing countries:
>>built-in map in the app where they can "tap" a country they have lived in and visited natural sites so they can have an overall view of where they have been and start comparing their experiences.

Arriving in the Netherlands:

>>the facts given by my app will be facts about what you need to know when arriving in the Netherlands as well as fun facts to make the "integrating" part a little easier for our new family expats.

on the #2 design (28/05/21)

on the #1 design prototype design (25/05/21):
-reflect more on the user's needs
-content of Staatsbosbeheer needs to connect with what your user group wants (is it more than just the nature routes, what else can you provide for them?
-your user group should be able to do more, add more features
-get everyone involved

Feedback

-the reflection aspect: Kids and parents should interact with each other just as much, if not less than they interact with the mobile app + nature. Parents shouldn't be on their screens the whole time and neither should kids, therefore come up with a solution that they both can reflect together at the end of the route.
- think of your final design, including different tones of green, add series of typography. Think about the hierarchy
-add the function in Adobe XD, have a keyboard pop-up when wanting to type anywhere where text is required! it will make the design more real

Feedback

on testing the #2 design (28/05/21) can be found in the "Testing; Documentation of a Prototype" click

Feedback

on the #1 design advertisement for App (25/05/21):

Final design Adobe XD

Click here to see my final design in action + final design for the advertisement of App