Monday 12 December 2016

‘MMc403.2’. Self-directed Website design

Self-directed Website design 


-Show steps taken
-Show how the design elements were created 

Useful links; 


(21/11/16) Brief; 
Design a website for your personal design company, research into the steps you will need to take to create website design's, and produce:

 -(2) Mood boards that show two different directions for the website
 -A style tile that shows the UI elements I could potentially implement
- wireframes that represent the layout of the website
- A set of rendered web designs that are industry standard
- A Style guide 


Other design companies websites to look at; 

https://wearejh.com/ Nottingham 
Inspiration; 
For inspiration I've screen shotted designs or images that I feel are nice and that are worth referring to when creating my designs...




















Action plan & deadlines; 

Week Commencing 21st Nov:
 -Update Design brief
-Research Local Market 
-(2) Mood boards (due: 25/11/16)
-Style Tile (due: 28/11/16)

Week Commencing 28th Nov:
-Update Design brief 
-Wire frames (due: 05/12/16)

Week Commencing 5th December:
-rendered web designs (due: 12/12/06)
-style guides (due: 12/12/16)
                                       
Steps taken; 
(mood boards) (22/11/16) I began by establishing a colour scheme and adding Images I thought invoked certain feelings, 
as well as adding type that complemented the images... 
I used the website 'unsplash' https://unsplash.com/ to find images. 


Mood board (2) (24/11/16)
for the second mood board showing a different direction of ideas. I went with a more more industrial feel...

I started following an account on insagram that posts recent Ui trends, it has given me some good ideas.. 
I found more inspiration on Instagram, the images on the web page gives me a good feel of what images of that nature will look like on a website... 
I found a logo that I think is really cool, I will keep it in mind and use it as inspiration when creating my style tile.. 
Style Tile; (began 25/11/16)
Creating the UI elements, logo, Typography, buttons, colour palettes and images... 


-I picked the colour pallet from my first mood board, i think the colours contrast really well and have a nice feel to them. The font I used is "coolvetica", it is bold and not too formal. 
-I chose a pattern based on the colour scheme from my mood board.
-I followed a style tile template that I found online, as well as closely using the presentation provided form Chris Bailey, a local Designer. https://speakerdeck.com/wearejh/design-process-and-deliverables

Wire Frames (began 1/12/16);

also following the presentation given by Chris Bailey, I created wire frames for my website, simple showing the functionality of the website. 

                                     

Web Designs(8/12/16)
I managed to complete the final web designs for the website, 



























Following my mood boards, style tiles and with the inspiration I've taken from other design companies websites i managed to complete the final designs for my website.  
















Style guides( 8/12/16):


-Images on the web page should be colourful and vibirant
[Images should be high resolution]
-Type should be bold and easily readable 
[none formal type]
-Images should provide contrast with the colour scheme 
-Colour scheme should have a palette of mixed colours from dominant to relaxing and 'happy' colours. 
-Images must be visually pleasing.
-There should be space 



Tuesday 29 November 2016

Critical review MMc502 Research and investigation





Initial research and investigation 



http://er.educause.edu/articles/2016/3/the-promise-of-virtual-reality-in-higher-education

Content; The article details VR manufacoting companies and softwares available, It's an interview with the auther of a book,Glenn Gunhouse he wrote ;possibilities of VR and how it might transform learning as we know it. 
the website is a trusted It website that reviews technology in education. 
the article also gives an insight to the history of VR.



http://fusion.net/story/281679/real-future-episode-10-doctor-vr
Content; fusion is a magazine/website that trys to uncover new interesting technologies being developed, in this episode of 'real future' they have made a short documentary about, Vr in medicine. with an interview with a surgeon. the website seems to be quite credible.

http://thebodyvr.com/medical-training/#av-layout-grid-1
Content;
The body vr is a company that have developed award winning software for teaching about anatomy. this software is said to be ground breaking.

http://www.missionv.ie/
content;
MissionV is providing a highly creative, totally immersive, game based learning environment for schools and industry. We’re putting the focus on 21st century skills, helping students to become original digital creators with 3D modeling and programming skills.  MissionV allows students to connect, create and collaborate in a 3D world entirely of their own making.

https://books.google.co.uk/books?
hl=en&lr=&id=NwLSBgAAQBAJ&oi=fnd&pg=PA141&dq=virtual+reality+therapy&ots=aQ1xQghjaK&sig=aGXOWfpUJkXIelmPwgjsnLHfmHc#v=onepage&q=virtual%20reality%20therapy&f=false
Content;
is a scholars article about Virtual reality Thearpy written by Max m North and Sarah North, its has desnse language. but is very credible.

Monday 28 November 2016

Critical review MMc502 (2500 word essay)

The possibilities of the distant and near future of VR in medicine and education and the effect it could have on society. 




In this research essay I will study the research into virtual reality (VR) and its future possibilities within medicine and education. “In a not-too-distant future, as VR technologies advance at a steady pace and become embedded in our lives, we may one day look back with a sense of amazement at students once bound to a physical classroom, campus setting, locale, or even place in time.” (Sinclair and Gunhouse, 2016). 


The future of virtual reality is clearly a highly exciting topic to ponder; in this essay I will look at new up-and-coming ways in which VR is utilised to benefit human beings, what the distant future could look like and where society will be with this promising technology. Could VR help cure our phobias? Could the use of VR help future scientists and doctors understand and cure cancer? Could the next generation be educated and trained with VR and perhaps grow up to one day change the course of humanity? 


The thought of these possibilities are truly exhilarating. While scientists and programmers have explored the possibilities of VR since the 1960s, 2015 marked the first time that VR hit the mainstream. Facebook CEO Mark Zuckerberg purchased Oculus Rift (the leading company in manufacturing VR) for $2 billion in March 2015, and by looking at how far Facebook has come since it was created by Zuckerberg, (GOOGLE, February 4, 2004) and its growth in the last year alone (‘$27 billion in revenue this year’ according to The Wall Street Journal), expectations for the future of Oculus are high. There are numerous other companies beginning to utilise this technology; you can watch movies in VR, live news events in VR and even hold face to face meetings. You can literally take people from opposite sides of the world and put them in the same room with virtual reality without using up any jet fuel. The market speaks for itself: "VR expected to grow to a $15.9 billion industry by 2019. The market for hardware, networks, software and content will reach $200 billion by 2020." (Reede and Bailiff, 2016). So will VR change the world as we know it? The reality has been a little less impressive so far, but with companies like Facebook and Microsoft pouring millions into these companies, could virtual reality break out of the misconception that it is just for gaming or watching movies and actually change how we live?


Recently, technology has been developed that could help paralysed people improve their physical conditions. A study by Donati et al. (2016) investigated the effects of brain-machine interface (BMI) training (which involved  VR training) on eight paraplegic patients with chronic spinal cord injury. After one year, all participants showed some improvement in sensation and 50% subsequently improved their classification from complete to incomplete paraplegia. Dr. Miguel Nicolelis, a neuroscientist involved with this study, has worked for up to 20 years to build and master these systems that record hundreds of simultaneous signals from the brain, and extract motor commands and translate them into movement. The encouraging results from the above study have led the authors to suggest that weekly training as part of rehabilitation could help patients re-engage and rekindle spinal cord nerves that survived the impact of car crashes, falls and other paralysing traumas. These studies are ground breaking and could revolutionise physiotherapy, making it possible for humans to recover from the most devastating of injuries. 


Elsewhere at the Medical Centre for Neurosurgery at the University of California, Los Angeles, the chair of neurosurgery Dr. Neil Martin is using VR on a different level. He is instead using it to help train and prepare his surgeons before they operate on patients. He uses the HTC Vive virtual reality headset to treat patients by stepping into the subversive world and looking at stacked 2D MRI scans that come together to make a 3 dimensional model of anatomy, i.e. a brain or lung. Using the head set he can submerge himself into the 3D model of his patients' brains and get a closer look at any abnormalities or tumours, allowing him to identify which tissues need to be removed and which structures need to be saved, as well as any issues which may arise during surgery (Santa Maria, 2016). He is able to pre-meditate surgery more effectively, and since the technology has been developed mortality rates have dropped in the last 12 months from 19% to 1%, a 99% success rate in brain tumour removal surgeries. “Virtual reality gives you that understanding of your entire 180 or even 360-degree anatomy that is impossible to get with any other technique”. “In 10 minutes, 15 minutes, I can see the critical issues that I’ve got in mind that have to be dealt with, and historically this took 10 or 20 years of experience” (Martin, 2016, cited by Santa Maria, 2016).


Other ideas have been developed recently. McGhee et al. (2016), from the 3D Visualisation Aesthetics Lab, UNSW Australia, explored the visualisation of nanotechnology in order to further understand the behaviour of cancer cells. Their idea is that chemists and cell biologists can use virtual reality to get a better understanding of the microscopic environments they are researching and engineering in. For instance, they can watch virtual simulations of the different ways in which nanoparticle drugs are absorbed by cancer cells, potentially helping chemists in the drug-design process. They can immerse themselves into a human body and explore anatomy using a virtual reality head set. With this technology, doctors and scientists can test cancer cells virtually to see how they react under certain circumstances; this has the potential to bring about some groundbreaking discoveries resulting in a wide range of cancer treatments. The software is yet to be released but the potential of this idea speaks for itself and its effects could reach out further than cancer. It could cover a wide variety of illnesses and diseases, including exploration of the effects of HIV on cells in the body and how the virus shuts down the immune system and causes the body to lose the ability to fight infections. This technology could lead to a new understanding of diseases and could change the way doctors and surgeons are trained. 


VR is also being used to treat PTSD in ex army veterans. "I have no question that Oculus will revolutionise virtual reality for clinical purposes", according to Dr. Albert Rizzo, a research scientist at the University of California's Institute for Creative Technologies (ICT) (Maguire, 2014). Dr Rizzo is using the technology to recreate battle field scenarios from Iraq and Afghanistan. Rizzo can recreate the same events where soldiers were actually injured. The technology also helps patients with other trauma too and is not just limited to related traumas; he says the programme is like "an emotional obstacle course". Dr Rizzo has also created a virtual therapist that ask patients personal questions. The virtual therapist can converse with a patient just like a human but because it is not a real person, patients are more likely to open up about deeper issues and therefore are more likely to get a positive outcome from the counselling. “This is like the birth of a new way of doing things with technology” (Rizzo, 2014, cited Maguire, 2014). This method is a type of exposure therapy, which has been researched for over a decade since 1993. The first known comprehensive control study on the effectiveness of VRT (Virtual Reality Therapy) in the treatment of psychological disorders was conducted by North and North (1994). In this study, the researchers assessed the effectiveness of virtual reality in the treatment of agoraphobia (anxiety)”. (Luiselli and Fischer, 2016).


Educational software is being developed for VR. ‘The Body VR’ are developing simulations that will aid in the process of medical education for surgeons and physicians. “Seeing the human body in VR will allow radiologists to quickly understand the subtleties of an anatomical system, compare them to traditional CT & MRI scans, and remember the details of each part of the anatomy.” (The Body VR, 2016).  The Body will take the user inside the human body, travel through the bloodstream and understand how blood cells spread oxygen through the body. You can enter a living cell and learn how the body fights deadly viruses. Surgeons will be able to attend/perform ‘virtual operations’ without being in the operating theatre. Physicians will be able to visualise the actions of specific drugs in virtual reality. This software is soon to be realised and could change the way medicine is taught and practiced, redefining healthcare and education.  The future of education is going to involve virtual space so what impact will virtual reality make on the learning process? ‘Mission V’ is a company that are beginning to create immersive leaning experiences for children. The company is providing a ‘highly creative, totally immersive, game based learning environment for schools’. Mission V encourages students to connect and collaborate in a 3D world of their making. “We are getting ready to take the next step by supporting schools that will invest in head-mounted displays like the Oculus Rift,”  “We are in no doubt now that virtual reality will become an ever more important part of education”. (Corbett, 2014, cited Abrosimova, 2014). The ability to gain practical knowledge to the classroom without leaving it really makes immersive education an invaluable experience. Rather than being stuck in class listening to lectures, students can get real life experiences. “Students need inspiration and encouragement to keep exploring the potential of education for their own capabilities. Engagement that virtual reality can produce will eventually veer students’ desire for exploration more toward intellect and away from play” (Wild, 2016).  “The pedagogies of constructivism and game-based learning show that children learn best by doing or by being,” said Corbett (Abrosimova, 2014). “So they shouldn’t just read about history — they should ‘be’ historians. They shouldn’t just study archaeology — they should ‘be’ archaeologists.” 


Across the world, classrooms have been educating the next generation , with students using tablets in class and learning programming from a young age . VR is the next step in this direction. ENGAGE is a VR Immersive education company that recreate everyday and historical experiences through VR. The company's hope is that children can learn about historical events such as the Apollo 11 moon landings though immersive VR and by actually experiencing it, rather than just reading about it in a text book. ENGAGE is also a presentation platform and multi-user social learning platform, where educators will be given the tools to create their own immersive learning experiences, potentially transforming how educational content is delivered to their students and allowing people to connect in a more natural way over long distances by placing people together in a virtual classroom. ENGAGE also integrates with Dropbox, Google Drive and Youtube, allowing the easy sharing of documents and media.  


In conclusion, throughout history there have been major fundamental changes in society which have dramatically affected the way people live globally. A number of agricultural revolutions triggered shifts in food production. Before these we lived as hunter gathers and were much less efficient, with small amounts of people feeding other small amounts of people. Following the first agricultural revolution, we started farming, planting large amounts of seeds to produce crops to feed the masses and society gained a great efficiency, arguably for the first time. It took fewer people to feed a greater number of people and signalled a huge shift in society. The industrial revolution, which began in the late 18th century, again led to a significant change in society. We went from one or two people working to produce a chair or clothing, to producing goods at a much faster rate. Although we became more efficient, we ran into a problem. If someone owned a factory or a mill, they would require employees to share knowledge with and to train. But how? We developed a need for universal education, meaning people gained greater skills and knowledge which leads us to where we are today and the next revolution - the ‘information revolution’. With companies and corporations like Google and Facebook, it has never been easier to gather and share information. What takes us maybe minutes to research now using the internet could have taken us decades without it. So think of the next generation; if we give them tools such as Google or VR to learn with then we could potentially make another fundamental change in society, where maybe everyone is educated in a way that meets their individual needs and learning styles. This could push everyone to reach their absolute potential, and if that generation came together as a community then the human race would have again gained even more efficiency and could perhaps have the ability and tools to solve the issues that are a currently a threat to humanity, such as climate change and disease. 









Table of Contents 

Abrosimova, K. (2014) 5 ways virtual reality will change education. Available at: http://www.hypergridbusiness.com/2014/09/5-ways-virtual-reality-will-change-education/ [Accessed: 24 November 2016].


Donati, A. R. C., Shokur, S., Morya, E., Campos, D. S. F., Moioli, R. C., Gitti, C. M., Augusto, P. B., Tripodi, S., Pires, C. G., Pereira, G. A., Brasil, F. L., Gallo, S., Lin, A. A., Takigami, A. K., Aratanha, M. A., Joshi, S., Bleuler, H., Cheng, G., Rudolph, A. and Nicolelis, M. A. L. (2016). Long-Term Training with a Brain-Machine Interface-Based Gait Protocol Induces Partial Neurological Recovery in Paraplegic Patients. Scientific Reports. 6: 30383.


Luiselli. J and Fischer. A,. (2016). "Computer-Assisted And Web-based innovations in psychology, special education and health" [online] available at: https://books.google.co.uk/books?hl=en&lr=&id=NwLSBgAAQBAJ&oi=fnd&pg=PA141&dq=virtual+reality+therapy&ots=aQ1xQghjaK&sig=aGXOWfpUJkXIelmPwgjsnLHfmHc#v=onepage&q=virtual%20reality%20therapy&f=false, [Accessed November 2016].


Maguire. P. (2014). "Inside the research institute battling PTSD with Virtual Reality". MOTHERBOARD [online], Available at: http://motherboard.vice.com/read/inside-the-clinic-battling-ptsd-with-virtual-reality/, [Accessed November 2016].


McGhee, J., Bailey, B., Parton, R. G., Ariotti, N. and Johnston, A. (2016). Journey to the Centre of the Cell (JTCC): a 3D VR experience derived from migratory breast cancer cell image data. In SIGGRAPH ASIA 2016 VR Showcase (p. 11). ACM.


Reede, D. and Bailiff, L. (2016). "When Virtual Reality meets Education". Tech Crunch Network [online], Available at: https://techcrunch.com/2016/01/23/when-virtual-reality-meets-education/, [Accessed November 2016].

Santa Maria, C. (2016). "The future of VR isn't games or movies - it's medicine". Real future, Fusion [online], Available at: http://fusion.net/story/281679/real-future-episode-10-doctor-vr/, [Accessed November 2016].


Sinclair, B. and Gunhouse, G. (2016). "The Promise of Virtual Reality in higher Education". Educause Review [online], Available at: http://er.educause.edu/articles/2016/3/the-promise-of-virtual-reality-in-higher-education, [Accessed November 2016].


The Body VR. (2016). "Medical" [online], Available at: http://thebodyvr.com/medical-training/#av-layout-grid-1, [Accessed November 20160].
Wild, J. (2016). "five ways VR can change education" Hypergrid business. [online]. available at: http://www.hypergridbusiness.com/2014/09/5-ways-virtual-reality-will-change-education/. [Accessed November 2016].

Wednesday 16 November 2016

MMc403.1 Chapter Illustration


Useful links:
css librarys: https://www.sitepoint.com/top-9-animation-libraries-use-2016/
Animation 'cheat sheet': http://www.justinaguilar.com/animations/#
parallax Sea Animation; https://codepen.io/Chilledson/full/GjgXpb/
scrolling css aNimation : https://codepen.io/zzavrski/pen/xVVdWo




Research

Experimentation into different web lay out techniques and web animation techniques

here are some examples of Web animation techniques; 

https://codepen.io/zzavrski/pen/xVVdWo
This example uses a scrolling text parallax Animation.
If I was to use this scrolling parallax animation I could use it to introduce new chapters of my chosen book.  I would change the scrolling speed, so that it is easier to read the text.

This example uses an image parallax animation, It was made by a designer named Lewis, If I was to use this code in my website I would change the duck image into a peach and try to re-create a scene from the Tim burton film James and the giant peach. This example also uses a mouse tracking animation.

http://codepen.io/EricAnton/pen/jaFBA
This web animation uses css only to create an underwater bubble feeling. I could incorporate this into my website keeping with the theme of water.  


This example uses css animation. it was created by a web designers called hakim El Hattab. This is something that could be used as a background animation.  

 This example uses java script, 
created by a digital agency called parallax a company based in leeds. Its  clever site based on the recent American election, its purpose was to advertise the company. 

This example uses Java script, developed by "now sourcing" an info graphics company. 
I like the way this website uses simple animated gifs, as well as java script to tell a story. 
It also uses scrolling image parallax animation.

http://codepen.io/landrik/pen/jAYPbx I have used this animation in my final website, in the animation there are two images of cyclists crossing the bottom of the page, i have changed it to two peaches crossing the page. the animation was originally done by a designer called landrik. 

some examples of web layout techniques;

https://codepen.io/lukepeters/pen/bfFur
table layout ; created by luke peters this layout has been made with html and css. I wouldn't be able to use this with my chapter illustration.

https://codepen.io/bradfrost/pen/LtryA
Shifter layout; created by brad foster, he has used html and css. This layout is ideal for a chapter illustration web page.

https://codepen.io/johnstonian/pen/guhid
two column layout; created by a designer called Ryan Johnsten typically this layout would be used for an informative website.




Typography for feeling


typography has deep roots in our culture, 



Courier fonts were created to look like old typewriter fonts ----->





Helvetica is mostly associated with formal or official situations as it is used by the government on tax forms ---->




IF you would like to portray a more business or respectable image then consider   serif typeface 



or if you were looking to come across more modern and stable then you could use a san serif






Serif; perceived as traditional respectable reliable and comfortable 


Sans Serif is perceived as Stable, clean, modern and objective 

Script is seen as Elegant, Affectionate and creative 



Hierarchy and layout:

"Visual hierarchy is one of the most important principles behind good web design. It's the order in which the human eye perceives what it sees"

Principles of Hierarchy- 

'All cultures read from the top down and most cultures read from left to right.
Recent studies have shown that people first scan a page to get a sense of whether they are interested, before committing to read it.' 

-Use Size to Enhance or Reduce Visibility.

'The biggest design element gets the attention. '

 -Colour and Contrast to Direct Viewers’ Attention.

'We are drawn to colour, especially when its used to exaggerate or highlight information. '

 -Typographic Hierarchy, Start With 3 Levels to Organise Your Design.

'Typographic hierarchy is a component of visual hierarchy that can’t be neglected.'

-Choose Typeface Categories & Styles Carefully.


 -Give Your Layout Balance and flow.

'When you fail to plan for some blank space in a layout — perhaps in an effort to include as much information as possible — you risk ending up with a jumbled, confusing design.'

-Give Your Design Structure.

'The Rule of Thirds: Following the rule of thirds is one way of creating a dynamic composition where your focal point isn’t predictably placed at the centre. '

Picking colour palettes for web

Creating a colour palette  can be a challenge. but there are many colour scheme generators to choose from online..  from adobe colour to 'the colour app', and 'spy colour.com' 
 Choosing the right colour scheme is essential to a website’s success. Your layout and other design choices — including font — should be developed in concert with your colour scheme, which can ensure readability, cohesiveness, and beauty in the final product.



The colour wheel.. 

'The colour wheel allows us to see at a glance which colours are complementary (opposite each other on the wheel), analogous (adjacent to each other on the wheel), triadic (three colours positioned at 120 degrees on the wheel from each other) and so on.'




Design patterns:

'User Interface Design patterns are recurring solutions that solve common design problems. Design patterns are standard reference points for the experienced user interface designer.'

'Design patterns provide a common language between designers.'

Design patterns are guidelines that help designers build websites or UI, sticking to Design patterns is quicker, it can save a lot of time. Design patterns are tried and tested so you cant go wrong. 

'There are three basic kinds of design patterns:
  • structural
  • creational
  • behavioral
Structural patterns generally deal with relationships between entities, making it easier for these entities to work together.
Creational patterns provide instantiation mechanisms, making it easier to create objects in a way that suits the situation.
Behavioral patterns are used in communications between entities and make it easier and more flexible for these entities to communicate.'

Design patterns are, by principle, well-thought out solutions to programming problems. Many programmers have encountered these problems before, and have used these 'solutions' to remedy them. If you encounter these problems, why recreate a solution when you can use an already proven answer?'

https://code.tutsplus.com/articles/a-beginners-guide-to-design-patterns--net-12752