#moduletwo

Week 2 - Technology in Schools and Classrooms

[ Posted Sunday 17th November 2019 ]

Week 2 - Why Do We Include Technology in the Classroom?

[ Posted Saturday 16th November 2019 ]

Digital Native Versus Digital Immigrant

SHOW N’ TELL  🎤

An overview of what Adam and I learned about space this module:

We started off with the question “How do we explore distance and depth in metaphorical 3D space within 2D space?” Through looking at other apps, we discovered two things, depth is more about exploring and discovering things while distance is more about the essentials. Through the Spotify app, we realized that when talking about depth and distance, it is dependent on context and what the user is doing. Going to artists or choosing a song is going the distance whereas browse and random playlists the user is going through extra layers and going in depth with no end goal. With the Messenger app, choosing a friend and chatting them, the user is going the distance. Going through the features, like gifs, location, games, bots, the user is going in depth. Going the distance has a user aim and going in depth is more explorative.

Taken from the readings, dwelling in space protects a human from outside threats and provides security. By metaphorically extending dwelling to digital space, threats we discovered for users when dwelling in digital space was not knowing what to do, inconsistencies, interaction sustainability, and information hierarchy. We also explore the exception of Snapchat and why they were so successful. There is a thin line between interaction patterns being too inconsistent, yet still being playful and explorative maintaining sustainability.

We continued on in trying to link spaces and explored how to make it seem like a continuous space through animations, gestures, and visuals. Through animations, we talked a lot about the pros and cons of parallax, obscuration, easing, and overlay. We tinkered with the overlay by using the button to expand the space into a new page.

(Hypebeast App) With swiping gestures, we developed a new Hypebeast app that uses a grid user task flow to navigate through the app. We discovered that it made the app more consistent, uniformed the space and linked it together. By stripping it down to the basics, it made it seem like a bigger space when the articles seem “connected”.

(Desktop) With the MacBook animation example, we wanted to link the personalized space into one big space. We took a look at how the MacBook and the iPhone differs and tried to imitate the desktop to look like the iPhone’s home tabs. We removed the bar and added a scroll animation to connect the spaces together creating a more seamless experience between the desktops.

Critique Notes “Interactive”: engaging - Can be horrible and pleasurable? Desktop - Scrolling space → infinite? -Snapping feature can be discontinuous, separating What are the advantages of exploring metaphorical depth and distance? What was the point of discussing this? Does it serve any purpose? Conventions - Settled form historical reasons —> challenge historical conventions that have been engrained More articulate about the results

Reflection With this module, I think the most I gained out of it was exploring metaphorically how depth and distance relate to space and how animations can add and take away from the experience.

I think the advantages of exploring metaphorical depth and distance can help with features in applications. We talked about how distance is an essential function of the app and how depth is optional and explorative. We discussed a lot on how everything depends on user context. I think we can take this information and use it to make applications sustainable by providing users optional layers of depth to an app. Like Snapchat, beyond the essential distance of snapping someone a photo, users can explore and play within the app. If making certain features discoverable, it would maintain certain interactions.

Making an experience isn't just about making it interactive, it can be engaging in both a horrible and good way. What makes a good interface is about making it communicative, it should relay the purpose of the interaction through a seamless experience.

WEEK THREE 🖥 We focused a lot on phone interactions and gestures for the first two weeks and wanted to play around more with desktops.

1. (Desktops) We started comparing the desktop workspace to an iPhone home screen. The iPhone home screen feels like we are panning, the background stays put as the user goes through each tab making it feel like a continuous infinite space instead of it being disjointed like the desktop. The desktop has a black gap with a changing background making it feel like a completely different space.

With our first interaction, we removed the black bar and made a static background. We found that it made the space more continuous by linking it together. It made the desktop look more like one big space instead of multiple smaller screens. What are the advantages of it? Why haven’t Apple changed it? It could become a bit disoriented if the user has more than five screens.

WEEK TWO 🚀

1. (Spotify) To get started, we played around with the hammer.js gestures and brainstormed how certain gestures help with linking spaces. We decided to use Spotify as an example. We explored how gestures can add to interactions and the user’s experience in moving through the space. We made a user flow grid where the user navigates through the app through a series of swipes in hopes of creating a continuous and fluid movement and space as the user moves through the features. We added a home button because Spotify was such a big app and if the user was to move through it fluidly, they would have to be able to go back to home.

Map of our grid:

How to navigate to playlist:

We came across some problems with the code, in loading the next playlist.f. Upon further discussion and reflection, we weren’t too sure what we were doing with it and thought it needed to be scoped down. We decided to move on from the Spotify app and put it on hold for a bit since we became too fixated on the way it looked instead of the interaction itself and the way it explored space.

2. (Threats to Dwelling) Me and Adam decided to go back to brainstorming about space and how the user may feel at home in a digital space. How do we, as designers, provide the user a place to dwell? How do we provide them security? What are the threats? We started off by listing the threats and understanding what may hinder an experience in hopes of creating a space where users can feel safe to dwell.

Main threats we came up with:

The user feeling disoriented, not knowing where to go within the app

Example scenario: when a user wants to buy a t-shirt through an e-commerce site, hits the back button to edit their address, instead of taking the user back to the address, it restarts the whole buying process creating a frustrating and undesirable experience

Example scenario: the user accidentally hits the back button and loses the place they were scrolling to resulting in having to scroll through all the content again to access unseen content, can hinder the user experience if the user has already scrolled through a good chunk of the content and have to restart the process again

ie. using tap as zoom

ie. using swipe to go back, but also using swipe to pan in a different feature of an app

Must be consistent and uninformed to not feel a disconnect within the space

Keeping interactions and apps sustainable over time

An exception we talked about was Snapchat, how its inconsistencies in design somehow manages to help keep the app sustainable to its users. From last module, Clint asked how to make an interaction sustainable. Snapchat’s success lies in its users discovering something new every time they open it. It monopolizes on hidden features for the users to explore. There is a thin line between where inconsistencies in interactions can be interesting and engaging to the user and where it can be frustrating and hinder the user experience. Snapchat is a playful app that allows the user to discover new things. Which made me question: Snapchat, depth or distance? Snapchat, the main feature of sending an image to someone could be going the distance whereas discovering new features, like Shazam and news, is going in depth.

3. (Continuous Space) Is it possible to create an intuitive sense of continuity between linked spaces? We took a look at how to link spaces within one big space through animations, gestures, and visuals. How do we create a sense and understanding of movement and change in space, yet feel connected

Animations are a combination of space and time. Speed is a super important factor to consider when designing animations since it can add to the experience or hinder it drastically. We decided to review the following animations: obscuration, parallax, easing, overlay, and dimensionality. 

Example: when on the iPhone you click into a folder and it obscures the home page

If it attracts users to stay on the page, does it make it sustainable though? Would users eventually get over the fun factor of parallax?

Can be disorienting 

Not completely necessary, it is fun and cool, but isn’t essential 

Can be visually distracting, taking away from the content of the page

Gestures vary from phone and desktop. We took a look at how the MacBook uses the trackpad and force touch to navigate around the interface versus how the iPhone uses swiping and tapping gestures. We concluded that the iPhone had a more tactile approach and felt like the user was actually using their fingers to move through the space because of how tangible a phone is.

We also talked about how important visuals can be when tying together space. Visuals such as colour palette, hierarchy, and icons must be consistent when moving from one space to another for uniformity.

4. (Hypebeast App) After discussing about gestures and the way they add to the interaction, we decided to go back to the Spotify grid navigation and scope it down to a news site that only includes top ten articles. We chose to use Hypebeast content so we have something to design around.

How does this change the screen space?

Makes it more consistent

Creates a uniformed space by linking them together

Could be disorienting if there are more pages linked together

Strips down the app to the basics, simpler

Feels like a bigger space when the articles are “connected”

More tangible

Continuity

Gesture of dragging connects the spaces together

Easy to understand what you’re doing

Reflecting on it, we came to the conclusion that this design is only suitable for a phone sized screen because of its simplicity. On a tablet or desktop there would be too much empty and dead space. The gestures and the interaction of dragging/ swiping does not have the same experience on a desktop as on a phone. Using a phone and touch makes the interaction more direct by removing the extra barrier of the tool/mouse.

5. (Personalizing digital space) How can we more easily move things around in digital space? How can we furnish a digital workplace so things we are working on and with are ‘at hand’ and ‘in view’? After the accelerator workshop, we played around a bit with perspectives and how they add to personalized space by connecting it back to the text.

What is personalize space?

Macbook desktops

Smartphones

Photoshop

Messenger

Tumblr, blogs, etc.

WEEK ONE 🌫 This week we started off by exploring and comparing different apps and social media platforms on how they use digital space to their advantage. (Partner: Adam Terne)

1. (Brainstorming)

Notes on how to start and from talking to Clint:

Orientation = where you are

Directionality

Where digital spaces meet and don’t meet

Where we are in our file system and the internet

Bodily sense of space

We started by thinking of examples of physical space and how humans move about them.

Maps

We use maps to navigate and direct us from Point A to Point B

Keyboards

Users have a sense of where they are when they are typing while staring at the screen

Actions are intuitive/ muscle memory

Questions we came up with:

How do we explore distance and depth with 2D space? We started with webpages. We came up with a preliminary definition that distance is hyperlinks that take users to other domains whereas depth is hyperlinks that stay within the domain. We started to test it out on different websites to further build upon our definition. Do login screens hinder the user or does it make the user go deeper? Is it comparable to a door, does it take you somewhere?

Spotify We opened up the Spotify app on desktop and started exploring with it. We added to our definition that depth can be measured by whether or not the user is exploring if the user is going deeper into the content or not. Distance is when the user is moving from one place to another. Are preferences distance or depth? Distance has an end goal, the user must have an aim to go the distance. Depth is more about exploring and discovering new things. If a Spotify user was to look through the browse playlists then they are moving through layers, through depth. If they were just selecting a song from an album or artist then they are going the distance. This means that CONTEXT needs to be taken into consideration when talking about metaphorical distance and depth in digital spaces. Do smaller screens make it seem like there is more depth to the app? Why? We found that with smaller screens you are pressing to get further and they are more tangible.

Messenger

With Messenger,  we found that distance is more essential whereas depth is optional. With Messenger’s features, the user can go into the depths of the app to access optional features like location, gifs, bots, games, etc. To talk to someone, the user would only have to go the distance by tapping on the person. It doesn’t affect the overall purpose of the app if the user chooses not to explore the app further and go through the extra layers.

Infinite Scrolling

We came to the conclusion that websites like Pinterest, Facebook feed, Twitter, and Tumblr that use infinite scrolling adds to the depth of the digital space because the user is exploring new content.

How is time relevant to our definition of depth and distance?

Tumblr vs. Instagram

Instagram is posted once, but Tumblr can be shared over and over again. You can only view an Instagram post at a given time frame whereas you can find Tumblr posts from three years ago.

Does your perspective change over time on a website? How is time portrayed? How do we keep interactions sustainable over time?

We also explored on screen size and came to realize that having a bigger screen doesn’t necessarily mean that you have a bigger space to do things. It all depends on the user, most times you can do more on a phone because of its tangibility than on a twenty-one-inch flatscreen. Sometimes it may be physically harder to interact with bigger screens.

2. (Dissecting the text) Notes:

Decisive quality of mathematical space = its homogeneity

Unstructured in itself 

 Regular throughout —> extends in all directions into infinity

Distinct centre

Distinct system of axes

Experienced Space

Space that is manifested in concrete human life ‘éspace vécu’

Medium of human life

Dürkheim: ‘possibility of development’ and as ‘resistance’

Not a neutral, unchanging medium

Full of meanings referencing life, has opposing effects

Change according to tho the locations and areas of space

Kantian

‘Transcendental ideality’ of space

More than a mere form of human experience 

 General form of human living behaviour

Has ‘empirical reality’ 

Space is something fixed in relation to man, within which human movement take place

The Elementary Structure of Space

1 The Aristotelian concept of space

Natural Place

Space has a natural structure

Space as a Vessel

Not a system of relationships between things, but the boundary, completed from the outside, of the volume taken up by a thing

The hollow space bounded by a surrounding cover

Exactly as large as the thing that makes it up

Finite

Can lie within each other

There is no empty space?

Does not extend further than the things that fill it

2 Word usage and etymology

Everyday linguistic usage

Raum: elbow-room for a movement, space/distance between things, ‘free space’ around a person

Narrowness and Width

Linguistic references

Determined by the situation

‘Orte’ and ‘Stellen’ in space

Ort: does not imply extension, a filled surface or a filled space

Always specifically located and precisely fixed point

Retains sense of pointing

Can only move to a different point but can not exchange places and positions

Stelle [Position]

Fixed position of a thing

Place where one puts something and where this is later to be found

3 The natural coordinate system

Vertical axis and horizontal plane: upright man

Aristotle six kinds of space:

Above and below

Front and back

Right and left

Directions naturally arising from the position of the human being standing upright in space

The earth’s surface

Horizontal plane

hree forms of looking back, retreating and returning, represents the three basic forms of natural forward movement in an opposition direction

Perspective

Can never see an object independently of a particular POV

Never see it as it is ‘in itself’

Constantly changing

Always bound to a perspective

Objects change in size according to their distance from the observer

Horizon

Prevents one from getting lost

Gives the means to determine one’s situation and to work out the path of one’s intellect

Always remains the same

Extends in front of people a wide field of vision and movement reaching forward freely into space

A boundary that positively entices one into the distance

Broadens out spatial development for humans and immediately restricts it again

Belongs inseparably to the spatiality of human existence

The placing of man in the center of his space and the horizon that encloses it are thus necessarily dependent on each other

Dwelling

Basic state of human life

To be at home in a particular place, rooted in it, belong to it

Special effort, man must ground himself

Have a fixed place in space, to belong to this place, and to be rooted in it (p.124)

Space and Security

Needs to secure the area by suitable means

Rest and peace

Relax his constant alert attention to possible threats

Offers protection

“We dwell plurally” “with our own” “separate from the others, the strangers”

Must outwardly protect, but also inwardly designed to meet the needs of those who dwell in it. Homeliness?

Mediating structures that interpose themselves?

Distance

Hodological space according to Lewin

The change that in concretely lived and experienced space is added to what we had already designated the accessibility of the respective spatial destinations

Space is structured as a totality of places and areas that belong together

Things to potentially explore further:

** How do we, as designers, provide the user a place to dwell? How do we provide them security? What are the threats?

To feel at home, we use common interaction patterns, things the user is already accustomed to for consistency

Does your perspective change over time on a website? How is time portrayed? How do we keep interactions sustainable over time?

Does your perspective change over time on a website? How is time portrayed? How do we keep interactions sustainable over time?

How does perspective change in digital space?