DESIGN PORTFOLIO

To make this into a modern website design, I have taken inspiration from the medieval and gothic appearance to make a tattoo website. I drew banners to place text headers in and I used a black and white colour palette for the inky look. I used AI generated photos of tattoo designs to create an image gallery for a portfolio section and used boxes to create structure like in the original art. My inspiration was the illustrative ink style, which reminded me of tattoo line work.

Simplicissimus

By Thomas Heine, 1897

To make this into a modern website design for a pub, I have cropped the dog’s head and made it into a logo icon. The original art uses only a few elements, so to match the minimalistic look of this poster, I have replaced the menu with a hamburger icon for a more simplified look. I illustrated a beer glass and made it look reflected for depth and I chose a similar, slightly imperfect font to create a heading text aligned opposite the illustration. I added an arrow to direct visitors on the website and used a similar refined colour selection to the original art.

AEG Lamp

By Peter Behrens, 1910

To make this into a modern website design for a light appliance brand, I’ve made similar geometric shapes using a dotted brush for an elegant and classical look, it also reminded me of detailing seen on hanging chandeliers. I have created a drawing of a lightbulb and placed it in the middle, illuminating the centre outwards and creating focus, where I have added a heading and a button using the same golden style as the text boxes in the original, which I added an inner glow to for depth and shine to feel more luxury. I used serif typefaces for a fancier and more classic look and created a menu with different product types on next to the logo.

Blast No.1

By Wyndham Lewis, 1914

To make this into an energy drinks website, I have been inspired by the dynamic angles and the energetic fonts and used these in my own design. I made this as a pop up ad for their new drinks flavour, which is berry. I used the pink colours to show the flavour and added drink splash illustrations framing the text. I added a cross so the window can be closed, and a button which takes you straight to the product. I also made a faint gradient from the middle to create depth and draw the eye in as I noticed that the original artwork is also darker around the edge.

BOSCH

By Lucien Bernard, 1940

To make this into a modern website design for a music streaming service, I have used the colours to make a navigation banner. I used a similar typeface to make the logo and illustrated a microphone which was shining like the item in the original art. I used my own photographs to create images for different playlists, and arrows to swap between them. I made the middle one bigger to show that it is the one playing. I added a bar to show how long the playlist has left, and used the same orange and purple colours to match the top of the website.

08 Kriegsanleihe

By Julius Klinger, 1918

To make this into a modern website design, I have recreated the dragon illustration and used it for a Chinese restaurant website. I used the same limited colour palette and placed the illustration at the right of the frame so it stood out. I also found a font which was condensed and serif like the original. To break the website up, I used lines which were similar to the arrows of the original. I added a menu to the bottom left, which continues off screen, and an order button at the top left to add balance. I also added a phone number in case some people would prefer to ring instead of order online.

Soaring To Success

By Edward McKnight Kauffer, 1918

To make this into a modern website design for office supplies, I took inspiration from the triangular shape of the birds. This reminded me of stationary found in an office. I used the same colours for my own design, adding strokes to match the border on the artwork. I used an AI generated image of an office desk and placed text for a sale right in the centre to fill the spacious area. I created triangular shapes pointing inwards to the text to lead the eye in, and I added a shadow to them so they looked part of the image. I added icons for the navigation and a search bar too. I used a similar style of font to match the original but to also create a formal feeling which is suitable for an office.

IT IS WARMER DOWN BELOW

By Austin Cooper, 1924

To make this into a modern website design, I have created a landing for a music festival website. The squares of the original inspired me to create an illustration which shows audio soundwaves, using the same gradient colours to show the volume getting louder. I also made speaker illustrations at either side, creating balance and symmetry. I cropped part of the original to form a logo for the festival and added a hamburger icon to avoid cluttering the composition as it was busy. I found a similar typeface and added a large heading and a button to buy tickets. I kept the overall colour palette the same and tried to create an energetic feel.

Rural Electrification Administration

By Lester Beall, 1937

To make this into a modern website design, I used the imagery to create a website for a solicitors. I used similar shapes and colours, like the diagonal orange shape, to cut the composition and create a dramatic edge. I made arrows which pointed through the top right corner to form leading lines and pointed them to the heading, and an recreation drawing of the house. I made the heading about buying a house to make sense with the illustration. I used a heavy sans-serif font for intensity and added a hamburger menu to the top right corner.

Fortune

By Joseph Binder, 1938

To make this into a modern website design, I have took the same colours and glowing effects to make a website for a betting organisation. I used a blue background, which is glowing in the centre, and added boxes to create sections. I made the boxes a dark gold and used the same dark blue for the text and to add contrast. I added a sign up section and a navigation below, showing different sports to bet on. I showed upcoming football matches, with a large button to bet now, and illustrated team shirts to show who’s playing. To match the stars and the glow, I used flare brushes and bokeh brushes to create a similar glowing effect, which felt shiny and appealing.

References

Bealle, Lester (1937) Rural Electrification Administration [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.rit.edu%2Fpress%2Flester-beall-poster-radio&psig=AOvVaw21IDVHOx8ExmI-tQmrRp_f&ust=1683499964048000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCPjg9pzk4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Beardsley, Aubrey (1895) The Studio [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fen.wikipedia.org%2Fwiki%2FThe_Studio_%2528magazine%2529&psig=AOvVaw27TSxLjmqPld501mKmSHCM&ust=1683500160690000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCMD48_nk4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Behrens, Peter (1910) AEG Lamp [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fsmarthistory.org%2Fpeter-behrens-turbine-factory%2F&psig=AOvVaw26YZcpCBTyYxgEOboLIVSj&ust=1683500032788000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCPiI3bzk4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Bernhard, Lucien (1914) BOSCH [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Faudradesigns.wordpress.com%2F2019%2F01%2F24%2Fplakatstil-sachplakat%2F&psig=AOvVaw0UBIUf3_h4IyflvUfdzk8k&ust=1683500332913000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCOjAoczl4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Binder, Joseph (1938) Fortune [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Feyeondesign.aiga.org%2Fseminal-designer-joseph-binder-is-proof-that-even-legends-escape-wikipedias-notice%2Ffortune-magazine-joseph-binder%2F&psig=AOvVaw3fIU7e7eVoCUO0lCQIKBr5&ust=1683500425485000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCJjH6ffl4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Cooper, Austin (1924) IT IS WARMER DOWN BELOW [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.ltmuseum.co.uk%2Fcollections%2Fcollections-online%2Fposters%2Fitem%2F1983-4-1662&psig=AOvVaw0iwMPCRA0IyWFRpMHbMiwT&ust=1683500498675000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCMj4kZvm4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Heine, Thomas (1897) Simplicissimus [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fwww.art-prints-on-demand.com%2Fa%2Fheine-thomas-theodor%2Fsimplicissimus-1-1.html&psig=AOvVaw0zMrmG_JAgW2eYaShA0R-e&ust=1683500623743000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCID-4Nbm4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Kauffer, Edward McKnight (1918) Soaring To Success [Image]. Available online: https://www.google.com/url?sa=i&url=http%3A%2F%2Fwww.artnet.com%2Fartists%2Fedward-mcknight-kauffer%2Fsoaring-to-success-daily-herald-the-early-bird-on-CIpDCY82GRo5eXB0-N_PKQ2&psig=AOvVaw0mAneMPB0dag2SbHmSdA5z&ust=1683500720056000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCMCz14Tn4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Klinger, Julius (1918) 08 Kriegsanleihe [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fcommons.wikimedia.org%2Fwiki%2FFile%3AJulius_Klinger_WWI_poster.jpg&psig=AOvVaw3mrOtsTJYL0fOpcqP8qKnp&ust=1683500842906000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCOj8or_n4f4CFQAAAAAdAAAAABAE [Accessed: 06.05.2023]

Lewis, Wyndham (1914) Blast No.1 [Image]. Available online: https://www.google.com/url?sa=i&url=https%3A%2F%2Fen.wikipedia.org%2Fwiki%2FBlast_%2528magazine%2529&psig=AOvVaw0SZS_I_O8U1RZhOSP17tNd&ust=1683500908819000&source=images&cd=vfe&ved=0CBAQjRxqFwoTCLjH2d7n4f4CFQAAAAAdAAAAABAJ [Accessed: 06.05.2023]