OUGD503 Responsive Building The Arts Party Website Wordpress or Wix?

Once we had made all the decisions detailed in the previous post, we went onto the basic Wordpress that had been serving as a temporary website up until now.

We struggled from the outset, getting the exact look and feel that we wanted. So many complications impeded us along the way, such as getting the logo in the right place. We had to make a full header width document and then import as an image.

We also looked into adding the tag line underneath in the highlight red we had chosen. We were lucky that this orange red showed up as one of the default colours of some of the wordpress themes. 

However, The main issue we encountered was that of getting the tiled layout to the blog posts that we wanted. Even when a blog preview showed the layout we wanted we could not, through any categorisation or portfolio filing, achieve the look that each theme promised us. We soon tried to upload our own themes, but found that updates to wordpress made this impossible, along with directly editing any code.

We then in a move of surrender tried out wix. This was so much easier. We instantly managed to mould exactly what we wanted from a blank template.

Wix allowed us to create the page system that we had planned and the drop down menus.

When it came to the tiled blog posts it was much more achievable and we started to add in details such as social media interaction buttons and structures to the other pages.

We also found we could edit the appearance of the mobile website and the way the menu sat on the page worked out brilliantly. It allowed for ease of usage and the fast communication of what the site provided.

It also allowed us to remove aspects of the website that worked on the main website but not on the mobile website to keep it from being cluttered.

We chose the orange highlight colours for the mobile drop down menu. This was so that we didn't over crowd the page with colours and push the logo into the background. The choice of the orange came from the development of the flyer and the decision to try and create a slightly more gender neutral image for a very pastel based colouring that they had already established

At the end of the day we had a functioning website with a few more touches yet to come.

The next day we just added a few improvements. Like lines in the green from the logo to provide some needed structure to the page.

I also put together the side menu with the colour coded events at the party and I think this really brought together the website. 

 On the mobile website we also added the slight drop shadow you see above because, looking at it on a phone the image needed a separation from the white background of the website.

Lightening the menu was a nice addition, keeping it in continuity with the light airy feel of the rest of the website. I also felt like adding the green as the clicked colour made the website feel more cared about and clearer in its usage and navigation.

Once again to maintain continuity I did this on the main website menu as well.

This was all in keeping with the reversed out theme of the buttons all over the website. As you can see the events menu at the side of the page also sticks to this.

For the moment we limited the seeable pages so that no place holder information comes up on the website. We also set the about page as the landing page, because fast communication of the cause is one of the major necessities of this website.

OUGD503 Responsive Building The Arts Party Website

Me and Fran (the initiator for the LAP) got together to discuss and start constructing the leeds arts party website. Although the pages below look like a lot of scribbles they actually detail a lot of decision making.

We talked about what the site needed to contain, like a meet the team page and links to social media outlets, and that we wanted an image based look with a tiled flow of information from the blog section of the site. We wanted the blog to contain info about up and coming events in leeds that could relate in some way to the arts party. This would fill and constantly change the content on the main page.

We talked about the established aesthetic of the Leeds Arts Party and how we would transfer this onto a digital format. This seemed to be most achievable through the use of colours. We discussed the limitations of web safe colours and the fact that the colours in the logo were not going to be consistently reproduced on older screens. On this point we made an informed decision to stick with the non web safe colours because the majority of our target audience would be creatives, so mac would be the dominant way our audience would interact with the website and therefore colour translation would be much more achievable.

We went on to take the colours from the logo and allocate it to  a type of event going on at the arts party. Beyond this we also made the decision to use the orange/red from the logo as the rollover button colour and highlight for the page. this comes from the subtitle colours used on the leaflet design earlier in the year.

We then talked about the links between the pages and what could be accessed through each page. This lead to the idea of creating a separate menu for the different event in the part and using the allocated colours we talked about earlier in this menu.

We went through all the colours in the logo in photoshop and got the hexadecimal code for each. This was so that we could maintain complete colour accuracy throughout the design process. 

OUGD503 Responsive Studio Brief 01 Individual Practice Leeds Arts Party Website Research and Analysis And Brief

Before we met up to start discussing the website fully, Fran sent me a few links to websites that she felt might be useful in relation to the website for the arts party. I can completely see how each of these could contribute to the Leeds Arts Party website and its good to see that we are both on the same page.

The colour scheme is what obviously relates to the arts party. These are not web-safe, but perhaps this is not something that we must conform to in this situation because creatives would be the target audience and the ones that would be mostly accessing the website (via macs). The idea of the colour coded menu at the side is really nice and could be improved and applied to the different events at the conference. Otherwise, the space that this website has is very refreshing look and something that I wish to emulate on the website. The logic behind this is the fact that the images that will be on said website are likely to sometimes be illustrations and art, with high visual texture levels, in order fir this not to feel busy, extra space must be allowed.

I believe it is the blog structure that is in the websites shown both above and below that Fran is particularly keen on implementing. They both use square tiled effects, that allow the images to do all the talking. On a conceptual level this works brilliantly with the entire cause of the arts party and its celebration of the arts. This tiled or modular grid may be more doable in formats other than wordpress, but this is something we will tackle on the day, because I know this will be tricky, but is important to the user experience of the website.

The element that instantly grabs me from the moment you enter this website is the slide show of all the latest blog posts that sits at the top of the page. This is definitely something that could be used for the blog aspect of the website once there is enough content. It instantly creates a sense of vibrancy , both through the simple fact that it is moving and the varied colours of the images, and vibrancy and celebration is what the arts party is all about.

Brief:
Create a simple functional website for the Leeds Arts Party. It needs to convey the positive activism at the conferences core and help establish a link between the printed promotional material and the online campaign that is just kicking off. 

Background Considerations:
The website will need to be designed with an eye to material created for the conference day so that visitors relate the two platforms. A system of organisation needs to be developed for the events on the day so that organisation and signage are easier to understand and the information on the website is reachable.

Deliverables:
A functioning website that the members of the arts party can access and update when needed.

OUGD503 Responsive Wallpaper Brief Final Submissions.

Once I had go the pattern to a stage that I was happy with I submitted it. I was great to see it at full scale and the website submission seemed to hint the illustration towards a slight greenish tinge witch actually works really well. I also went on to do an inverted version with touches of colour, because I was sad that the time limit wouldn't let me do the full scale coloured illustration that I wanted to do. The digital colour with the reduced opacity actually worked really well, conveying the idea of the translucent texture of the jellyfish.

I also experimented with adding further colour to the original colour way with this reduced opacity approach. I really like this but am uncertain if I should pursue it further. 

Evaluation:

I am fairly happy with the way this brief worked out. However, there are many things I would change about the way I approached it. More than anything I wish I could have enacted the plans I had for the water colour and ink colouring of the illustration. I spent a large portion of the early stages of the brief working this out, only to have too little time at the end to do it. On the bright side, I do feel that the design still has the dark scratchy appeal that  wanted to achieve. 

When i set out to address this brief I knew I wanted to create a pattern that was interlocking and a completely different creature to the tiled and basic repeat that I saw a lot of in the submissions. This repeat was a nightmare to achieve. No matter the planning and work I put into drawing it correctly, there was always a discrepancy that would show up when the pattern was put together. In the end there was no other way but to digitally edit the pattern, which was an equally long winded process. Despite these set backs I think that the repeat is quite impressive. It does do what I set out to.

One thing that I would change about it would be the square shape of the repeat. I would probably have to contact feather and ask about a more amebic shape for the repeat because it was a requirement for the submission file. The problem with this is that, through the little experience I have creating repeats, the eye is much more likely to be tricked by a repeat that is not a regular shape, and a square is the most regular of shapes and I can definitely see the seem of the repeat. However, this could just be the perfectionist in me, possibly others cannot see this.

Another set back would be the ratings the wallpaper has received so far. Ah well! I am content that I have produced a wallpaper that I would want on my wall and I had fun doing it, what more can you ask for?

OUGD503 Responsive Wallpaper Brief Finished Illustration

I had to put this project to one side during the submission of module OUGD504 and so I found my self working to the deadline of the competition a bit. However, I finished the repeat and scanned it in using the A2 scanner downstairs in the digital print resource. I had some trouble matching the two parts of the repeat together because the repeat was still too big for the A2 scanner. However, with some help I found the photo matching tool on photoshop which made short work of my problem. 

I really like the colour of the stock in the scan, an unexpected bonus, it has a softness to the off white colouring that works well with the etching like illustration.

Despite my efforts with the illustration, I had some trouble matching up the repeat of the wallpaper and had to play around with it quite a lot to work. I uses numerous layers to nudge each side of the repeat in different directions.

After hours of work and re touching of the repeat I got to a stage where it had to do. and I am quite happy with it.

OUGD503 Responsive Wallpaper Brief Drawing the Repeat

I took a lot of practice and trial and error to get an outline of the repeat that worked properly. I used layers of different tracing paper over the seems to the design to get the lines to flow as seamlessly as possibly from one side of the repeat to the other.

Once I had done this I had the outlines of my pattern and I used the light box to trace it across onto some more substantial paper that could take the amount of scratching and ink that the illustration would use.

When it came to the final pattern I ended up taking out the smallest of the jellyfish in the astern because I felt it would be complex enough in its visual texture with the intricate style of illustration I am pursuing.

OUGD505 Design Practice Studio Brief 01 Product, Range and Distribution Start of Open Research

OUGD505 Design Practice Studio brief 01 Product, Range and Distribution

This brief is very open ended and requires a large amount of research to determine an exact message and direction to go in. I have stated by creating a few mind maps but I found that the subjects that I was focussing in on were too personal to me and far to small for anyone else to be interested or engaged by them.

OUGD503 Responsive Studio Brief 02 Collaborative Practice

At the moment the major consideration is who I am going to work with. I have talked with a few friends and I think we have quite a good group together: Roz, who I have worked with before and I know I can work well with, Billie, who is another friend on the course who has a similarly illustrative approach to her design work, and two vis comm students, Fran and Izzy, who have wanted to collaborate with graphics students for a while and see this as a great opportunity. I am really excited about this brief because it will be a great meeting of very different creative minds which might just work and turn out something truly inventive.

OUGD504 Module Summative Evaluation

OUGD504 Module Evaluation (summative) Beth Taylor

Overall this module has been quite refreshing for me. Throughout the first year I was constantly plagued by worry and panic about my ability to complete work to the expected standard and how my work was always the worst. Predominantly, I think this came from a lack of experience and no previous proof that I could do these things. However, with last year under my belt, I entered this year surprisingly anxiety free and enthusiastic. Even though this year contributes to my final grade I finally feel that my grade is nowhere near as important and the confidence, experience and knowledge I gain from being on this course and being surrounded by talented people. I have had more confidence to take risks and experiment more in the areas that interest me.

For example, I would probably say my most successful brief would be the second in this module. This might seem strange to say but I surprised myself during this week long brief. I really dug down deep conceptually, which is nothing new for me, but I also managed to produce something that I feel hits the nail on the head in terms of the message I wanted to send. I struggled hard with the legibility of the hand rendered type and creating a logo that was clean and assertive, not usually an aesthetic I am good at creating. After a long week of stress and constant trial and error, it finally came together after the final crit. The feedback that I got at this stage was so useful and a classic example of the way, for me, talking to people about my work allows me to step away from it and start to evaluate it through their eyes, which is quintessential to creating a design that fulfills its purpose. This is a concept that rings true in what I probably consider my least successful brief of this module (the last one).  The way the brief stretched over the Christmas holidays made it very difficult for me. I need to talk to others about my designs as they are forming (my form of formative evaluation) and no matter how hard she tries, my mum is no replacement for a studio full of my piers. The general lack luster feeling of this brief could also have been down to the fact that I felt like I wasn’t designing anything new. What really fuels a brief for me is doing something new and it felt as if I was simply applying a concept I had already design to different mediums. I should have made a more concerted effort to do something really new, even if some of the visuals were the same.

Something that has definitely contributed to my general happiness during this module is the increasingly large role illustration and hands on methods I have used in each of these briefs.  My illustration in the first brief, my hand rendered type in the second two and the food lettering in the fourth. I am not the kind of designer that can stare at a screen all day, and this module has helped me to discover this. In terms of production methods, I have not experimented as much as I would have liked to. However, I find it difficult to see where I could have done more in this area because so often I was held back by restrictions of the brief or considerations of the practicality of commercial print. Next module I am going to pay more attention to opportunities to experiment in production methods, so that I can learn as much as possible while I am here. I am especially waiting to try type setting and letterpress.

In terms of research methods I think that my preparation work over the summer has been the most interesting any useful research in the briefs of this module, and probably many to come. I did everything I possible could to create usable primary research material and it definitely worked. Taking pictures, colour sampling and sketching all contributed to creating a very usable body of work. Other types of research such as practical research are sometimes overlooked. A huge part of any type design, for me, is endless sketching, talking to people about each letter, and slowly crafting it into something workable, this in its self is probably the most useful form of research that I use in every brief. Secondary research can be just as useful, but has to be transformed into usable information. My predominant method for doing this, and something I have enacted considerably during this module, is the analysis of existing designs. Through writing about them I find information that was not originally obvious and theoretical ideas that I implement in my own designs. The best example of this would be the kick starter brief, in which I analysed the existing brand and found the abrasive and shape visuals they had decided on, a strange way to represent modern feminism. So, I took this and found that finding power in femininity was what I wanted to achieve with my design.

If there were one thing that I would change about my work during this module it would be the finishing quality of each piece. Although in some circumstances this was a designed scruffiness (Brief 1 and 4), I feel like some of the finished pieces are simply not good enough for submission. This is something I am going to strive to mediate in subsequent modules by making print slots far in advance and finding ways to preserve well printed work until submission. Although my work for this module may not be fantastic, I have a tangible sense of improvement and learning that leave me feeling positive about each brief.

OUGD504 Studio Brief 04 Augmented Design Final Prints

So the final outcomes are the table sticker,

Coasters

and Magazie insert.

Brief 04 Evaluation:

I found this brief quite difficult, both because I fell ill in the middle of it and the Christmas holidays sat directly over the end of the brief. This meant that I had to step away from the brief for a while, and when I returned to it, I was back at home, isolated from all the resources of college. You can say this is bad planning but when you are really ill you are incapable of thinking about these things. Considering these problems I am pretty happy with what I have managed to produce both in the restricted time frame and in these circumstances. Originally I had planned to do the salt lettering on the table sticker with the help of a laser cut acetate stencil but due to illness I missed my laser cut slot. So, when it came to producing the salt lettering for photographing I had to get a bit creative. I wish I could have really got it right and legible just by hand in the sugar granules, but I would have needed to produce it very large and then comes the problem of the ratio of scale between the granules and the letter forms; it may not have been recognisable but it wouldn't look right for the granules to be tiny in comparison with the letters, which is what would have happened had I done the design larger. This meant that I had to make considerable use of digital tools instead. It was difficult to find the balance between the legibility of the design and the texture of the granules but I think I just about managed it. The three dimensional look of the lettering is really interesting and creates the impression of spilled salt, just as I wanted it to. This is predominantly down to the photography and the decision to photograph on a neutral grey rather than black, this allowed me to maintain the shadows of the grains in later digital production. Photography is normally something that I really struggle with but this time the pinning down of exactly what I was using the photograph for and how I wanted it to look like really helped me to achieve it, rather than stabbing in the dark for something that might do. however the salt lettering is still something that I feel I could have done better with a bit of extra time and practice, I hope to pursue food lettering a skill later on.

Compared to this the other two print outcomes didn't pose as much a problem. However, the functionality of the magazine insert was quite difficult to achieve and could only be done through lots of trial and error and mock ups. Working out things such as the orientation of text and the order in which information is communicated proved to be most difficult to negotiate. In the end I think this is an interesting format choice because, rather than deciding the format and shaping the content around it. I think this produced something that performs its purpose in an interesting way, which contributes to its effectiveness as an advert. When it came to the coaster designs the main problem I encountered was a way to fit in the augmented reality design that was intrinsic to the overall purpose of the design, without it being a pointless gimmick relying on the technology to wow. I simultaneously considered augmented reality design for the other two print outcomes but felt that it just seemed to forced with them. Where as, with the coasters, the location of delivery (bars and cafes) meant that people would be more likely to have a moment to kill and the wifi to make a good use of the interactive element. I used an idea that had come up in a crit during the web design brief, which was that images of beautiful places make you want to visit them. So creating a location gallery that you view through the knot hole in the coaster seemed not only to have the best chance of getting people out on walks but also more engaging and informative than a pointless video or similar. 

The visuals of the interactive element are also a strong link to the original website design. This link between the advertising campaign and the website design is something I set out to achieve from the very beginning. I am confident I have achieved this because I had to use a number of visuals, such as the logo and some of the landscape images. However, there is a tangible evolution of the aesthetic from web design to the printed format. Although I have brought over the visual theme of white vector graphics over images, I have brought in the close up image of the untreated wood. This addition of an image that has a much closer field of focus than the landscape image creates a greater sense of depth to each of the designs, creating a distinction between the digital design of the website and the tangible grounding in the physical that print inherently has.

The delivery format for each outcome was considerably limited by the location specificity of the website subject matter. In many ways I found that very useful because it really made me think about how the target audience would interact with my designs and where those young professionals would actually have a chance to interact with my interactive print. The instant two answers to this are: when they are socialising (cafes and bars) and when they are at home. What cemented these locations was the discovery that applications such as Layar needed good wifi to work at all. This in turn gave rise to each of the format choices. 

As well as the augmented reality interaction the magazine insert has physical interactivity. The clear injection of thought into this aspect of the design instantly makes the insert more desirable. I also think it fits completely with the conceptual content of both the website and the other print outcomes. The way it gets readers to really do something physically, is exactly what the website is trying to achieve at a larger scale. 

The commercial print possibilities of these outcomes are high, mostly because of the small numbers that would be needed to enact the campaign in real life. This means that digital print is feasible for all the outcomes. The only slight hitch would be the necessity of paying for the inserts to go into magazines and for cafes and bars to use the coasters and the table stickers  which is hard to predict without actually having to do. 

Overall I am pleased with the outcomes for this brief, but do feel that little irritating errors such as typos could have been avoided if I had been at college for the duration of the brief and had the time to be really careful by printing tests and similar.