Skip to main content

Meeting with Bate Brand



My first meeting with Bate Brand was in their office in Ryde (Isle of Wight) . I presented my portfolio and explained to the team what I aim to achieve for the company on a voluntary basis. Mr. Bates gave me a description of what Bate Brand deals with and introduced me to a service called “Signature Printing” which provides print consultancy and advice to interested clients. I was shown the existing website and was offered to work on creating a modernised version of it. I accepted the offer and got to know the other members of the team as well – Elliott (Graphic Designer) and Rachael (Sales and Marketing). 

For most of my meetings with Bate Brand I got to work more with Elliott who showed me the principles of Squarespace – a content management system for building and publishing websites. It did not take me too long to get used to it as I had worked with similar online builder before. I was also given a task by Elliott which aimed to include HTML code into a Squarespace that is also using the twenty/twenty plugin - http://www.massexod.us/blog/how-to-create-before-and-after-images-for-squarespace . 


Another piece of code Elliott asked me to implement was relying more on CSS and Javascript and it adds animations to content blocks of the page in a way that it looks more dynamic and fun - https://www.droverrideshare.com/blog/2016/7/25/css-animations-and-squarespace . 


Both were completed successfully as Elliott seemed impressed and suggested that we should use them for the new Signature Printing website. At the end of the session Elliott asked me if I can come up with a demo concept for the new Signature Printing website and look into some similar websites’ design choices.

Labels:

Comments

Post a Comment

Popular posts from this blog

Implemening a Squarespace CSS Timeline

I showed Elliott the outcome of my attempts to incorporate a timeline that runs smoothly on Squarespace. I also did a lot of testing for tablet and phone mode (one of Squarespace’s features) and see how the platform responds to the code. Some of the codes did not perform as expected due to CSS segments that Squarespace does not support. However, I ended up choosing a timeline that had a modern look and a few options for customization – changing the icons and the background. Elliott was impressed with my progress as I also added more transition effects. Original CSS Code Customized CSS Code within Squarespace After doing a bit more testing I discovered that the icons don't show in an appropriate manner on mobile devices or any devices with smaller resolutions. As a result I decided to remove the icons but bring more contrast to the timeline items which joined by the animation effects would really make the content stand out Final Timeline Result Implemented ...
Post a Comment
Read more

Skills Gap & Job Analysis

Another step that I took which helped me visualise the steps I need to take in order to get a job in the field I have chosen was to look into current web design vacancies. Understanding what skills employers seek from candidates would help me analyse my understanding of how prepared I am at the moment to get a job in web design and what I need to do to increase the chances of getting employed. For the purpose I spent some time researching web design job specifications and came across a wide range of skills that are primarily required for the job. Here is a list of the vacancies which the content below is based on: Creative Web Designer - Atlantic Group (advertised by Indeed)  - optional screenshot Graphic Designer / Web Designer - Hays Specialist (advertised by Reed)  - optional screenshot Junior Web Designer - Become (Advertised by The Guardian Jobs)  - optional screenshot Web Designer - Dixons Carphone (advertised by TotalJobs)  - optional sc...
Post a Comment
Read more

Signature Printing Case Studies + Adding Final Touches

For the Case Studies section I was determined to find if it was possible to place a text block on top of an image – a functionality that I had not came across up to that point in Squarespace. I assumed that fading the background will put more focus on the text and make it stand out more. Initially, I looked into solutions that rely on custom CSS but none were relevant or worked nicely with the template. I told Elliott about the issue and he showed me another Squarespace trick which did exactly what I was aiming to accomplish but with no additional code. However, when typing the text I discovered that it is always displayed in the center of the image which can eventually make it less readable and not as functional for mobile devices A solution for that was opening the image on Photoshop and adding extra space where needed so that it does the text and the images do not blend and interfere. As more content was being added on the website or it was about to be added by Laura, I ...
Post a Comment
Read more