OUGD505 - Studio Brief 3: Watching The Border

I watched the movie that I got, The Border. Here are screenshots and annotations I made throughout it.

Mexican immigrants in building - church - with lots of candles.
Roof falls in and everyone panics
Camera follows girl with a baby through derelict open space



Next scene is car parking in factory


Jack and man who owns the place walk through factory discussing minimum wage and paying workers




Arrests two illegal workers


Drives home and sees wife


She said she had no time to wash her her, he asks what she has done all day


She shows him duplex she wants, and says her friend has made it available to them


He says he wants to go back into recreation services cause he likes feeding ducks. She says how its a dead end


She thinks it will be better in el pasa


He tells her they never talk about anything, and she says shes always available to talk


Next scene she is asleep and he is sat on sofa


Next scene girl from beginning gets worken up


Girl and boy walk through town



Next scene Jack/Charlie and wife drive through desert



Girl and boy are walking through desert


They sit down and rest


Glammed up woman (wife's friend) shouts they're here!


Charlie and wife pull into drive


The two woman embrace


Wife introduces her friend to Charlie


And then to whole family



Woman asks Charlie to carry her wife into the duplex


They look around the duplex, wife is really enthusiastic but Charlie doesn't say anything





The two women do a little dance and chant together that they used to do


Charlie and other husband get work uniform tailored



Walk down the street and husband tells Charlie how glad he is to have him there
Street is so typically 80s




In car with worker, talks about why they moved there


Workers wife is from Dallas, says theres a good group of boys here



While driving, illegal workers throw stuff at car, they get out and barely try to catch up before giving up


At nighttime they patrol the border, and watch immigrants pass. Workers say they let them pass as it is easier to catch them from otherside


They watch workers catch some immigrants




Charlie and worker get a call out and drive fast


Worker gets out and tells Charlie to stay in car
Gunshot sounds and worker falls to ground


Charlie reports back
Backup comes, and other worker pronounces him dead


Next day workers discuss what happened, and ask Charlie if he saw who did it, but he didn't





Meets the boss


Serviceman funeral






Charlie walks down a bank and sees the girl from the beginning getting water from a dirty river


He says a bit of Spanish, buenas tardes and that she is pretty



Boy steals metal from tyres and Charlie sees him
Tries to catch him but he fails




Girl gets it back and gives it to him


He drives home


Comes in through open door which has tube going to bedroom


He looks in and asks Marcie what it is


Its a water bed. 
He asks how much it costs and she ignores him


He asks again she says he doesn't have to worry about paying for it


She flirts with him and they kiss





They start to have sex on the waterbed


He looks up and sees price of $1589


Next scene he is driving with a colleague


They spot immigrants, who try and hide


They find them and start to arrest them



One breaks free and Charlie goes after him




When he brings him back, his colleague slaps him. Charlie tells him to take it easy
But the colleague finds drugs stashed on him


They pile all the immigrants into the cars



He notices the girl from earlier and starts to speak to her but she spits on him and starts to hit him


He puts the druggie immigrant into a cell



Meets a guy


Back in the unit now






His neighbour colleague says he thinks they have the same ideas about what needs to change


Neighbour says he wants to be his friend


He gets home, and wife asks him what he thinks about TV. He says it sucks

She says what does he think about her on TV

He asks, you want to be on TV?


She says its a seed sprouting in her mind
He says he married a fucking banana


He walks backwards and falls into a swimming pool

He asks what the fuck is this Marcie?
She says our new swimming pool!


He goes back to the water that the immigrants go by, and sees a woman. She glares at him




At nighttime he walks through the place all the immigrants stay



Sees a dead immigrant with throat cut


Goes home to find a party





Marcie tells him off for taking ages and dressing like this


He finds his neighbour colleague, and tells him he found the dead guy - its the same guy they arrested last week.


He tells him they have their own way of doing things there


His boss comes over and tells him he doesn't like his men going over there, cause if trouble arises its hard to get them back


Next scene, he and the officers see a train bringing in immigrants and pull them off




One boy stays on, Charlie goes after him and they end up underneath the train



The next day he sees all the immigrants outside in their work - i guess its like a jail


He watches the girl



'Good' mexican guy asks woman to get girls baby



An officer wants to speak to him


He speaks to his boss who congratulates him on the train incident, and talks to him about shooting ducks




Then we see the woman who was talking to the 'good' mexican guy get the baby from the girl and give it to him


She takes it to the 'good' mexican guy


Charlie and officer are in office speaking


The girl panics as she can't find it



Goes to the fence where the boy is staying screaming


He jumps over
Then everyone starts jumping over and there is commotion and the officers try and stop them


Charlie and boss are still in office talking about how there is big money on the table when they go and see the commotion




The officers start gassing the mexicans, and putting their masks on




They put all the immigrants into a car


Congratulate each other at the end



Next scene shows worker confront the 'good' mexican guy about stealing the baby


He has sold him to a family who paid good money, and he will have a good life
Worker tells him off and threatens him if he does it again
They spot another worker and say that is the competition


At home, Charlie is in bed, and Marcie has bought more household goods



He wakes up and goes into the living room


He shouts at her telling her no more, he can't afford it. 


She says she's doing this for him, so he can have a dream house



He slaps her


She is upset and says all she does is try and make him happy

He apologises and walks away


Next scene he is playing pool with neighbour colleague


He says he is open to the deal he is working on


Next they drive to the house where he does the deals.




The owner insults Charlie, and he goes to wait outside


Owner then tells neighbour colleague that he is batshit crazy and to keep him on a leash



Owner gives him stash of money


Back at their house they have another party in the garden



Charlie is in charge of BBQ and not doing a great job


Neighbours wife is drunk and starts a food fight with everyone






Marcie tells Charlie to do something, so he pushes the bbq into the swimming pool


Next scene neighbour colleague tips him off about a pickup truck that has 9 or 10 in
Charlie races after it



He catches the immigrants in it, and neighbour colleague takes the driver




He catches the immigrants in it, and neighbour colleague takes the driver


Charlie then hears gunshots from the direction of neighbour colleague and driver.



When he gets back to base, he confronts him asking where the driver is, and that he isn't in this for murder. He says he doesn't care about money but he isn't in it for murder, and he has crossed a line. Neighbour colleague says he pulled a gun out and that he respects his choice.




Next scene Marcie is getting her hair highlighted with Savannah


She expresses her concern that her and Charlie aren't happy and that the other night he asked her what is the point



Savannah tells her not to worry


Charlie is in bar on own and sees another girl. She walks up to him, have small talk





He walks out, sees mexican boy, asks him where he got sneakers and watch
They speak spanish, he gives him money, and then boy takes him to some bars



They go into a strip club, and he talks about the girl and the baby. Charlie asks if the baby is sick, but boy says he got stolen.


He sees girl sat down.


'Good' mexican guy comes over and says Charlie! any drink on the house for you, and he says declines saying he is here to talk to a girl


He says ahh, you want pussy! Pick anyone you like, free of charge.



He says I'll talk to this one


He says Esta, she's only good for one thing, Ill show you some that you will really like


He says no, Im taking this one, and if you try to stop me I will bring this place to the street
He then gets beaten up and thrown out
He walks away





Next scene neighbour colleagues son is horse riding, and good mexican guy tells him Charlie is trouble and needs sorting out, and he says he knows what to do



Next day at work he finds a car, and chases the driver and arrests him.







He doesn't check the back of the van.
At the office, an officer asks him how many people were in the van, and he says none, but the driver said there was two.
Neighbour colleague defends him, Charlie walks out.


Nightime, he goes back to the van to see what is inside it.


He opens it and dead bodies fall out.


He is sick.



Neighbour colleague is behind him
He has to push the van into the water, and neighbour colleague tells him he will cover him but he has to do as he says from now on




Back at home, he looks in despair.
Marcie wakes up, comes up to him and they embrace




Next scene he goes to the mexican boy and asks him to take him to his sister







He does, and he gives her money


She starts to take her clothes off but he says no señora


She thanks him


Next scene in a computer office, people get a call out



Mexicans are crossing water to get over border


Charlie watches them








Him and colleague let some get away across



They start to run here so they can get in the truck





Some don't make it cause they have drugs stashed


Juan makes it away


The guy shoots him


Two more officers see the truck and chase it


Charlie gets back in the car


The chase



The truck crashes



Charlie runs to the scene


Some are dead, some are hurt. The girl has hurt her leg


Charlie brings her home


Marcie wants to see all the commotion


Juan is trying to get away with shot wounds


Marcie is made to take care of her


Charlie goes to the 'good' mexican guy to find out where Juan is




Threatens with a gun



Marcie tries to console the girl



Charlie comes back for the girl 


Marcie tries to stop him and asks what his relationship with her is


They find Juan, and he is dead




They have a funeral


The 'good' mexican guy and boss guy find them and try to shoot



Have a shooting match





Charlie finds 'good' mexican guy and makes him take him to the baby





Finds baby







'Good' mexican guy runs away


To telephone box


Charlie takes the baby


Another shooting match. Kills neighbour colleague






Back to water where the immigrants stay


He brings the baby back to the girl



They're both happy



And that's the end.

OUGD501 - Theory Into Practice: Responsive Design (RWD)

As the website I want to produce is about evaluating people's opinions on whether the current web trends have improved usability and accessibility or not, I wanted both sides of the argument so that I can try and make my content well rounded and unbiased.

Biggest 8 Responsive Problems
This article goes through the top problems with responsive design, and solutions to them.

He got his data from sending out a survey on RWD.

Survey



The first one affects accessibility to clients if you can't explain what it is to them. The solution is a different approach to wireframing, which lets the client see where the content would be once scaled down.

01. Explaining RWD to clients

The 'old' process of designing a website was a very linear one, which made it easy for clients to understand. They'd go through a briefing stage, then some sort of wireframing and structural planning stage, then they'd get a set of pixel-perfect visuals to pick apart. Only when were these signed off would the site itself be completed.
As I'm sure many of you have found, this process is simply not up to scratch any more. One of the things many designers are struggling with is how to explain to clients that there isn't really a 'visuals stage' any more.
Responsive design is a much more fluid process and wireframing, sketching and prototyping are typically more powerful tools.

The solution: Demonstrate the power of responsive design

A better way to explain responsive design is to actually show a client what it can do. Don't just talk about breakpoints and media queries and multi-device functionality - it's easy to forget how meaningless these terms can be, even if some of them sound very obvious.


Responsive layouts, responsively wireframed by Adobe's James Mellers.
Responsive layouts, responsively wireframed by Adobe's James Mellers

If you can't show a site on a range of devices, conside demoing one of the many sites that mimic typical responsive breakpoints, such as responsive.is or Responsive Layouts, Responsively Wireframed (pictured above).
Navigation
Here is a point on navigation, and how to make the design work, be consistent and have good usability on all platforms. This is a really valid point, and I think the most important one. It can be hard to know how to design for it when you are used to just designing for one size. It mentions a really good article on the solution as well which I'll post after this.

03. Navigation

In the past, navigation on sites tended to be horizontal along the top of the page, or sometimes down the left of a page. It now needs a more considered approach.
The number of responses to the survey that mention navigation reflect just what a tricky problem this is to solve – and not one that has a simple canned solution.

The solution: Use good, consistent design

Choice of navigation strategy is is a wide-reaching decision, and should be based on your site's content and information architecture, along with a number of design considerations.
Rather than simply downloading a script or demo, I'd encourage you first to evaluate how it works, why does what it does – and most importantly, how it works for the site you're building.


 the Starbucks website.
Responsive navigation in action: the Starbucks website

And remember: test how your navigation works on as many devices as possible, and in as many cases as possible. It's amazing how often I come across sites where the navigation just doesn't work in any sensible way. Don't be responsible for creating one of them.
This is another issue - images. 
How to make sure they won't pixelate as this can create bad accessibility if someone can't tell what it is. It also makes the site look bad and doesn't look professional. SVGS are solution to some types of images, and although doesn't solve the whole problem, it is a step into the right direction.

04. Images

Much like navigation, the set of options available for handling images in responsive designs is incredibly fragmented. As yet, the W3C community group hasn't backed a specification, so we're left with what amounts to a personal choice of a wide range of scripts to fill in for this missing functionality, and deliver appropriate assets to devices.
To further complicate things, designers must also consider the next generation of devices with high-pixel-density displays such as the new iPad and Macbook Pro, along with a range of non-Apple hardware.
Like code, images and icons should be as flexible as possible to ensure that graphics on high-pixel-density devices don't look blurry because they've been scaled up poorly.

The solution: Scripts, SVG and icon fonts

While there may not be an 'official' solution for responsive images, there are some really great solutions out there that are good to use right now, and give us positive results without resorting to too many hacks or code workarounds.


Oak Studios' Symbolset semantic icon fonts adapt well to differing screen sizes.
Oak Studios' Symbolset semantic icon fonts adapt well to differing screen sizes.


Responsive Navigation Problems
From that article, here is another really good one on how to solve navigation.
Here are the approaches that he suggests:


This is how the 'Top nav or do nothing' approach looks like. The nav bar just squishes into the space, which can look quite unorderly and chaotic. It also means that the content is pushed down, so when you go onto a page you can't see what it is about. This is a problem, because users judge a page based on what they see first. However, it is an easy solution, and it is familiar to the user because they are used to seeing it at the top of a desktop version. It also means if you have big fingers it isn't easy to click what you want because it is squashed together, which can reduce usability.


Here is another example he provides:


The Select Menu
Here is one that I like (when done well) - rather than condense it all, have a button which will drop down the navigation. Usually this is represented with three lines - however, I think this can be confusing because not everyone know what it represents. I think that is something designers use and think everyone will know what it means, but they don't. 

Here is an example of it on the article, which I don't actually think is very good. There is a drop down 'navigtion' button, but I couldn't even see where it was for about 5 minutes. When you go onto a site you need to be able to see it clearly as this is what you want. I would have gone of the website by the time it took me to find it.


The pros of it are that it saves space, so the user can see all of the content. It can be easily seen if it has a clear title like 'menu' or 'navigation'. It also means whether you use touch screen, a mouse or trackpad it is easy to use because you can drag or click it. By having a menu for it, people with big fingers or who don't have an accurate touch it doesn't matter because of the spacing around the words.

Problems with it in terms of usability are it might be confusing to people who are expecting it to be squished, and it involves the user clicking an extra time to get to the nav bar which slows them down. It also means sub navigation can look weird.

The Toggle
This is where the menu slides open, while not changing the place the user is in. This is easy to understand, the links aren't squished and by not jumping it doesn't confuse the user. It also looks good and scales well. The only problems are code related, not design, such as it is dependant on javascript and some devices don't handle animation very well.


Left Nav Flyout
I also love this option! It is what Facebook uses, so people who use Facebook on mobiles will already be used to it. The menu icon (three lines) is used, and when clicked the navigation slides in from the left. It looks good and provides space. One of the problems with this is that it doesn't scale well. This means you can have two different styles of navigation for mobile and deskstop which 1. can confuse users and 2. you'll have to maintain two separate navs.


Definition
These are some different introductions to RWD.

Creative Market
This focusses on how there has been a rise in mobile devices, so a rise in RWD, and how it looks great on all devices.


This focusses more on the coding aspect, and CMS's.


Awwwards
This talks about how people want unification between devices and responsive design will do that.

Quotes
I am now picking out quotes that people have said about responsive design, as I want to include these in my website.

Responsive Web Design

'Mobile browsing is expected to outpace desktop-based access within three to five years.' - Ethan Marcotte

Responsive web design offers us a way forward, finally allowing us to “design for the ebb and flow of things.” - Ethan Marcotte

Why Bother With Accessibility?

We started designing responsive websites so we could be more future-friendly, and with a shared goal of better optimised experiences, accessibility should be at the core of responsive web design. - Laura Kalbag


Dao
Designing adaptable pages is designing accessible pages. - John Allsop

42 percent of smartphone owners between the ages of 18 and 29 consider their phone as their primary way of accessing the internet (from Pew Internet).

Uncle Sam
Mobile was the final front in the access revolution. It has erased the digital divide. A mobile device is the internet for many people.
Mark Boulton

To me, responsive design is more about a change in the browser and device landscape. 

Responsive design is forward-thinking and means it will work on a phone, and that’s where things are headed’.


OUGD503 - Responsive: Matthew Savage Photography

This is all the research I did for this brief. I didn't really look at any portfolio websites as I didn't want to get influenced by them, as they are all pretty similar.

Jon Wyatt
The client told me a photographer's website that he liked, regarding the monochrome and clean style as well as the navigation. I had a look to see the sort of style that he wanted to go for. The navigation is actually pretty hard to use because it is at the bottom of the page, so hard to see, and has a fading feature when you hover over it. This brings up the sub navigation. I like to see the albums on a portfolio website so you can visually choose what you want to look at, but you don't have that option here.


I find the images awkwardly placed in the middle of the page.


At the bottom of the images on the album pages you can hover over the pagination to see what pictures there are which is helpful for the user.


This is what the navigation looks like. It's unfamiliar to the user because it's at the bottom.


Aside from being hard to use, I understand the style - clean, minimal and monochrome. I can work with that.

I wanted to create SVG for the site, which are scalable vector graphics. This means they can be scaled at any size and not pixelate, which is what are used on responsive sites. I didn't know how to do it, so I googled it. Turns out it's really easy, all you do is save a file to the format .svg. 





 Paul Boekhout
I wanted to see how other people used portrait and landscape images together, so I looked at this website.
There is one image per screen, so black has been used on the sides of portrait images. This is something I considered but didn't know if people did it because it could look messy. However, it is done here what is considered to be a good design, so I feel better about it now. I do think it is better if there is no gap between images, but this is something I can talk to my client about.



Facebook Vector
I wanted a Facebook icon vector to link to his facebook page, so I found a free vector pack that I could download.



 

Copyright 2010. All rights reserved.

RSS Feed. This blog is proudly powered by Blogger and uses Modern Clix, a theme by Rodrigo Galindez. Modern Clix blogger template by Introblogger.