Introduction  The brief for this group activity was to design a social media campaign surrounding a cultural event of significance. The overall branding must be consistent across platforms to make the campaign recognisable. First, Lucy and I researched some events for inspiration and came across a local campaign HU5 With Friends. They’re a group of people who host local events to bring the community together. During the covid-19 lockdown, they hosted socially distanced walks to prevent loneliness and provide support to those who needed it most. Our cultural campaign was designed to bring people from the university and community together to take part in activities that would either promote health or improve the environment. The campaign would host events such as walks, litter picking, upcycling workshops and much more. We decided to design for Instagram and Facebook as we could attract two different types of audiences, as the older generation uses Facebook more often than Instagram. We worked together to design a Logo that could be used across all platforms and generated a colour palette that was calming and represented our cause in an approachable manner. Individual contribution  My individual design contribution consisted of designing a Facebook article/post promoting one of UoH Toghethers community walks, and taking inspiration from other Facebook posts. The design follows the universal design of every Facebook post, including the like, comment and share buttons. I made sure my design was in line with Lucys’ Instagram content, utilising similar illustration styles with the use of Adobe Express, I completed my designs in Adobe XD. Teammate contribution Group Reflection Reflecting on the group as a whole I believe we worked well together and were able to make design decisions without any setbacks. If we were to do this project again I feel it could be useful to work outside of university hours to ensure we were both on the right track as I felt I lagged behind slightly. If we had more time together we could have expanded more on each platform and maybe come up with more ideas regarding activities to promote. References Log in to Adobe Express (no date) Login. Available at: https://express.adobe.com/sp/design/post/new?workflow=blank&fallbackThresh=default&trigger=CreateProjectMenu&sizeCategory=custom (Accessed: December 17, 2022). 

Introduction This development blog aims to understand what an NFT is and how digital artwork is created. An NFT is a non-fungible token, which means it is completely unique and cannot be replaced. An NFT can be anything digital, from artwork to sports memorabilia or even a social media post. The way NFTs are created is the AI (artificial intelligence) searches databases for anything surrounding the keywords you input into the system and then generates an image reflecting your choice of words. Below are some examples of NFTs generated from the source Wombo.Art.  Task 1 The first task we were given was to explore Wombo.Art and the different themes that are provided on the app/desktop website. The Wombo.Art website works by providing the user with a set of different art styles to choose from and then asking for a prompt, keyword, or words. There is a character limit of 200, meaning the user can generate images that are quite accurate to what they’re asking for.  I wanted to explore Wombo.Art by creating digital art based on well-known subcultures. I chose to generate digital art surrounding, Skate, Club Kids and Acid Rave. The website generated a range of different outcomes surrounding the keywords I inputted into the system. I changed the art styles to further explore the different outcomes, I used Retro Futurism, Bad Trip, Vibrant and realistic. The images below are the outcomes of the AI experiment.  Task 2 The second task we were given was to use Wombo.Art to create a piece of work exploring the opposites of purity and pollution. I used a range of keywords and phrases to generate different NFTs that could be used to develop a piece of digital artwork. The different theme choices came in useful when trying to get different outcomes from using one keyword. Once I had generated some different images, I proceeded to import them into my WordPress blog and edited them using Elementor. Moreover, to create a transition between the different images I uploaded one image to the background layer and then added a hover mode which changed to a different image when the cursor hovered over the background image. This technique enabled me to show the different images in a creative way. I added a heading over the top and used multiple images that complemented each other but also showed the differences between purity and pollution.  Reflection Considering I was unable to attend the lesson in person I utilised the resources provided and developed my outcome independently. The developed work explores the opposites of purity and pollution using AI-generated software, I learnt what an NFT was and made good use of the Wombo.Art generator. Attending the lesson next time, I would ensure to work in a group and explore NFTs within the group to develop different outcomes which could be linked to each WordPress blog. Not attending resulted in me not having a group to work in as everyone had already developed and finalised their work in groups. Furthermore, I believe not working as part of a group didn’t stump my understanding of the subject and I still gained a lot of knowledge working independently. I was able to take full control of the outcome without having to factor in others’ opinions. Although in the future other opinions and outlooks could be useful when developing more in-depth work. References Dream by Wombo (no date) Dream by WOMBO. Available at: https://dream.ai/ (Accessed: December 17, 2022). 

Introduction The tasks below show experimentations based on parallax images. Individual Task 1  The first exercise was to experiment with widgets in Elementor and make a parallax website based on a space theme. The first step was to add a single-column section and change the background colours to a gradient that fit the whole screen. I then added a page heading on top of the gradient. Next, I added a new single-column section to the website and changed the background to a space-themed image. I then set the image attachment as fixed in the settings, this anchors the image to the page whilst the rest of the site is scrollable, resulting in an image parallax. I then added a heading to the page and set the positioning as absolute. This setting allows us to move the heading freely around the page and also will result in a scrollable effect when the user scrolls the page. After adding the heading to the page we decided to add a spaceman image as a background overlay. This gives the effect that the spaceman is floating in space. Moreover, to ensure the image blended into the background I changed the image opacity and also set the image as fixed so that it moved with the original background. Next, I added a UFO image to experiment with animation. I set the image as absolute so that I could freely move the image around the page to achieve my desired effect. I then animated the image with the use of motion effects in the settings window. I decided to set the animation to ‘slide in right’ to give the overall section more movement when the user scrolled the page. Finally, to emphasise the parallax further we added another section and changed the background colour. I decided to use a bright green to add a pop of colour to the overall design and to create a breakpoint. I then added an image of the sky to the website as a fixed attachment to finish off the parallax effect. Individual Task 2  The second exercise gave us the tools to create a layered image that moves with the users mouse. We used existing code from CodePen to create the effect with Elementor widgets. The first step was to open BBEdit and create a new page with the opening style tag, <style>. I then copied over the CSS style guide from CodePen and pasted it in after the opening style tag. I then closed the style tag by inputting </style> into the page after the CSS was imported. I then copied and pasted the HTML after the CSS in BBEdit. After importing the HTML I needed to add the JS (JavaScript) to the BBEdit page. To do this I added a new opening tag <script> and pasted the JS from CodePen. I then closed the tag by inputting </script> into BBEdit. Finally, I copied and pasted the whole Code into the HTML widget on Elementor which translated into the moveable image on the page. I then made sure it worked by previewing it in a different window. Individual Task 3  The final task was to design a parallax website promoting fair trade products. I decided to use imagery and video to inform the audience about Fair Trade products. I used knowledge from the first exercise to create the parallax website. Individual Reflection Reflecting on the tasks above, I learnt and carried out new experimentations independently. I am confident with creating parallax websites and believe the design element may come in useful when designing my final campaign website.  References Mouse move parallax – codepen (no date). Available at: https://codepen.io/oscicen/pen/zyJeJw (Accessed: November 3, 2022).  Stock images, photos, vectors, video, and music (no date) Shutterstock. Available at: https://www.shutterstock.com/ (Accessed: November 3, 2022).  Unsplash (no date) Beautiful free images & pictures, Unsplash. Available at: https://unsplash.com/ (Accessed: November 3, 2022). 

Introduction  The aim of this development blog brief is to undertake a design analysis of the Spellzone onboarding sequence and pre-login page. Analysing the site will establish any improvements that could be made to make the overall site more inclusive and user-friendly.  Spellzone Website Exploration The first website investigation was conducted on the home page and pre-login structure. Upon first entering the website the user is greeted with an image of children which immediately communicates that the website is assumed to be designed for children at school. Layered on top of the image there is a clear heading reinforcing the initial presumption, stating that the website is an online learning resource. As the user scrolls the page there is a brief explanation of what the website is used for and who can use it, from reading the insert it is apparent that the resource is aimed at attracting the teachers’ attention more than the children themselves.  The second investigation was conducted on the onboarding sequence. The sequence is made up of part text and part imagery. The images are quite small and hard to see, these images may be especially difficult to see if the user requires glasses. The sequence explains the reasoning behind the website, what it does and who can use it. Reading the inserts, the sequence explains that people from the age of 6 to adults can use the website to improve their spelling abilities. I feel the images used to promote the resource are childish and may come across as patronising to an adult wanting to use the website.  Target Audience The Spellzone website appears to be aimed at schools and teachers striving to improve their pupils’ spelling abilities. There is no obvious promotion supporting parents or students themselves wanting to sign up for the resource.  Spellzone Website Improvements The first improvement that could be made to the Spellzone website is the addition of separate logins for students, parents, and teachers.  The student login should be simple and take the child straight to their own dashboard with clear progress reports and leader board motivating the children to push themselves and progress through the spelling activities. The parent’s login should take them straight to an overview of how their child is progressing and show them any next steps they should take to help improve their child’s learning. Finally, teachers should have their own login which shows them each student’s individual progress report, modules, and class progression. The overall user experience for the different audiences would be improved by providing the individuals with tailored and specific information. Login mock-up The second improvement that could be made to the Spellzone website is the addition of a fun onboarding sequence that would explain the aim of the website in a concise manner. The below video is an exploration of a potential onboarding sequence. This would improve the user experience by clearly demonstrating the point of the website as soon as the individual reaches the site. Visual onboarding mock-ups Adobe XD link to visual onboarding mock-up https://xd.adobe.com/view/e0682f8c-048e-441b-98f5-2744e6386967-b53b/ Conclusion Due to being absent during the Spellzone analysis, I missed out on being part of a group. This led to having no feedback from fellow group members which I feel led to underachievement in this activity. Improving on this activity next time, I will ensure to work as part of a group to gain others’ knowledge and input to ensure a good result. I believe I came up with good improvements that would improve the overall user experience, but these could have been criticised and improved more within a group. References What is spellzone? (no date) Spellzone. Available at: https://www.spellzone.com/ (Accessed: December 18, 2022).