Adobe XD experimentation 5/12/2023:
Using Adobe XD and the help sheet, I created and experimented with a website furniture format, starting with an iPhone 14 page. I used Adobe colour to generate a range of pinkish colours to add to the blank page, then downloaded the images of the furniture with Onedrive. Initially, I used a picture of the blue landscape room then I switched it to a picture of a pink chair to match the theme of the colour shades and my website theme. Making the #F5C6DA shade the main colour in the website format, I then dragged the images of rooms into my artboard folder and added text in the font Segoe UI and Lato. I created the navigation icons using the circle, line, and square shape tools to create the search bar and the option lines.
Room files
Progress so far, I still have to create another page and add other icons
Something that's missing is the sign-in and the shopping bag icon because I forgot to add them when I created the first page. I could've also made the direction lines bigger and bolder, it's not that noticeable when you first look at it and the search bar could be more spaced out on the first page because it makes it look a bit crowded. I changed the font on the first page from Segoe UI to Segoe print in size 33 pt to make it look more decorative. I had a pink theme, I used pictures from Google of pink furniture on the first and second page. For the pictures on the second and third page, I downloaded a range of sofa images from the furniture session folder
App planning 13/12/2023:
This is my mood board so far, I'm using Canva to create this. Using Pinterest I downloaded pictures of colour schemes, palettes, typefaces, and website buttons. For my app font, I'm using a fun font that's bubbly or has big letters for the main focuses, then a smaller typeface for the information.
App analysis 18/12/2023:
Etsy logo, the Minister EF book font is similar to the font used on the Etsy logo
Etsy is available on iPhone and Android
Overall app design, the white and the orange shades work well together
The first app that I'm analysing is Etsy, founded in 2005, it's an American E-commerce company that focuses on handmade items and craft supplies. The company collects listing fees and a percentage of the sale cost. Since you can't download it directly onto a Mac I'll use screenshots from the app store. The visual appearance of Etsy is yellow and tan, mostly lighter colours, the app, and search bar are orange, and it's the same as the logo. In my opinion, the app's appearance is very neat and presentable, the typefaces that are used are easy to read and the app is easy to navigate. Etsy appeals to its targeted audience through its front page which has gift-idea advertisements for Christmas including gifts for their home, clothing, and jewellery.
Their homepage has simple colours such as white for the background and black for the buttons, I like this design since it gives off a minimalistic feel. Etsy's use of buttons makes it easy and accessible for their customers to navigate. Etsy's reviews from sellers are mostly negative, it has a 1.6 rating on Trustpilot.https://uk.trustpilot.com/review/www.etsy.com I found a few small businesses talking about how their account was terminated without warning, and how Etsy removes items from the seller's listings.
Reviews from past shop sellers that have used Etsy as a marketplace
Here are the advantages and disadvantages of using the Etsy app as a business owner:
Advantages:
- Using Etsy is easy to set up and maintain, making it accessible to people who are new to the app
- Etsy has built-in visitors, bringing in 95.08 million in 2022, I used stats from https://www.statista.com/statistics/409375/etsy-active-buyers/
- A strong and supportive community is within Etsy, featuring Etsy forums and coaches, Etsy is a good place to go for help
- Established payment system
- Seller education and support
Disadvantages:
- Increased competition - Etsy has grown to become a massive online marketplace with millions of sellers, as a result, that makes it harder for new sellers to stand out. Bigger businesses on Etsy might also corner the market on niche audiences, and smaller stores could have a problem with promoting their products
- Fees - Etsy has introduced new fees and increased existing fees, in 2021, Etsy introduced a new offsite fee that charges sellers that make a percentage of their sales if they make a sale from an advertisement placed by Etsy off of the platform
- Handmade? - Not everything sold on Etsy is handmade, if sellers see that their product is getting more attention and sales they might order through another service that actually makes the items, reselling the item at a higher price but advertising it as 'handcrafted' made by them
- Focusing on sustainability - Recently, Etsy has placed a bigger emphasis on using sustainability, encouraging sellers to use eco-friendly materials and packaging and offering tools to help them offset their use of carbon emissions. I put this as a con because Etsy sellers, especially smaller businesses can’t afford to switch to more eco-friendly materials since using plastic is cheaper
The next app that I'll be analysing is Facebook.
Facebook's logo, it’s plain and simple and the colours work really well together.
Facebook has a section for the purpose of selling items at an affordable price, While looking I found a range of products being advertised, including furniture, makeup, and arts and crafts items. Marketplace opens with photos of items that people near you have listed for sale. When you find something interesting you can tap on the image to find out more details, such as the product description, the name and profile photo of the seller, and their general location. The Facebook marketplace was released in October 2016 and described as an online space where users can buy and sell new and used products locally. Since 2016, the Facebook marketplace has extended to 222 countries, independent regions, and territories, allowing eligible users to buy and sell their items too.
The layout of the Facebook marketplace is very convenient, having different categories depending on what you're looking for, including a price meter that you can adjust to your own preferences, such as the minimum and the maximum spend. The colour scheme of white and blue is pleasing to look at. However, there are cons to using Facebook marketplace:
- No protected purchases, Facebook doesn't verify sale items so when buying the item make sure that the account seems real
- There are big safety concerns to consider when using the marketplace, the exchange requires face-to-face contact, and in some cases, it can be dangerous to meet up to complete the sale
- No digital stores, unlike apps such as Depop or Vinted which allow their users to create a digital shop, users on the Facebook marketplace use their personal accounts to list items
- Scrolling through the Facebook marketplace to find your desired item might be time-consuming to some people, and in the end, it might end up being a scam
These are some great advantages of using the site:
- Facebook offers different marketing tools that can be adapted into impactful ad campaigns.
- Facebook marketplace accepts versatile forms of payment, such as Shopify and PayPal.
- Broad audience - With 1.85 billion users daily, Facebook is the ideal app for users wanting to reach an audience or buyers needing to find a particular item
- Another advantage that I found while using the Facebook marketplace is the location toggle, allowing users to set their location anywhere, making it easily accessible based on the products you're looking for.
Buying: The forum allows you to search by product, price, location, and display items based on your browsing history and membership groups.
- Easy to navigate - Whether you’re browsing or selling an item, the Facebook marketplace is simple to use
- No hidden fees - A great advantage of using their marketplace is that hidden fees aren’t added to the items; the products just need to fit the guidelines set by Facebook and you can list your items for sale. Facebook also doesn’t charge any listing or marketing fees as it relies heavily on marketing revenue, making it cost-effective for both buyers and sellers
- Appealing to a target audience - By using Facebook marketplace you can find your targeted audience based on the location setting or the search bar, making it easier for you to find the item you want
Map of the area I chose to be within a radius of
App planning sketch 18/12/2023:
When creating my sketch, I used the layout of the Ribblr app as inspiration. Available on iPhone and iPad, Ribblr is a crafts app used for patterns, video tutorials, and finding materials. I sketched my app layout based on their phone format:
This is a rough sketch of how I would like my layout to be, including more pages for information, such as the FAQ and the 'About me' pages. I’ll be using Adobe XD to create my app since I’m familiar with the software when I experimented with creating pages for my furniture website. I’ve added a settings layout, pattern page, logo, and the Contact Us tab. Below are some more features that my app will include:
- Sign up / log in page
- Pattern and material resource page
- Stitch guides for beginners
- Information about my app, when it was created, new and upcoming features for my app, etc.
- A Contact Us page, links to the social media accounts
- Seasonal accessory patterns for Winter, Spring, etc
Wix website layout:
To make my website, I'll be using the free website builder, Wix. I chose a template that I thought would match the aesthetic of my website the best, colour shades, fonts, pictures, etc. Since the last progress website review, I've made changes to my website, I created a blog post as a welcome and added it to my front page. For now, I've taken pictures from Pinterest and added them to my pattern and
archive page as a decoration but I'll change it to my own pictures as soon as I take some. The font size that I've chosen could also be bigger since I've realised that it is hard to read on the pink background. I used the arts and crafts website Ribblr as inspiration, using the website icons to create my pages and the blog page.
I changed the font to Wix's own font, Wix Made for Medium in font size 17. I also switched the colour of the 'Contact Us' page to a darker pink shade, making it easier to see the text.
I have about 6 pages on my website:
- Home
- About
- 'Our patterns'
- A contact page, an email, social media accounts, and the company phone number as well as the address
- Frequently asked questions
- Blog
I might add one more page for further information, maybe a favourite pattern for the month.
Top half. The main font that I'm using for my website is Playfair Display, I like the fact that it's a simple and classic typeface. The colour scheme of this page is perfect, the cream shade matches the chosen font perfectly
For the bottom half of the patterns page, I also created a page for Spring patterns, using a crocheted tulip that I found on Pinterest to match the theme of Spring. I still need to improve upon this section, finding patterns for this section and adding links to the patterns, including the ones for beginners and the seasonal pattern collections. For the beginner's section, I'll need to add the stitch abbreviations such as CH, SCH, HDC, DC, and SL SP to make it easier for people who are new to Crochet and would want to take a look at my website. I should also add the links to my blog page with the information on the headers, e.g. the blog entry, 'Learn the basics of Crochet' 09/01/2024. I'm still not sure about the colour scheme for the pattern guide, the pink background doesn't really look good on the white header to me, changing it to a darker pink shade might work even better. I'll link resources where you can buy Crochet materials, such as Hobbycraft or buying them using an online retailer, making sure that it's budget-friendly and affordable for people looking at my website.
Contact Us page, I used the WixMadeFor text for the email and the Playfair display for the telephone number. To make the Contact Us page even better, I need to replace the phone number with my personal one, making it seem more realistic. I could also change the email address to a more suitable one, something with only words instead of adding the 3 to make it more formal. When making my website, I used other Crochet websites as an ideal example. Websites such as https://www.happyberry.co.uk/,https://www.allfreecrochet.com/,and https://saltypearlcrochet.com/ for examples of the layout of a Crochet website. The homepage of Salty Pearl Crochet's website is a perfect layout of a homepage, including the patterns, tutorials, and signup information, I based my website homepage on this. For the design aesthetic of the overall website, I decided between vibrant, colourful, or simple and light shades for the background and the pages. The colour scheme for my website is eclectic colours, Honey Mustard, White Mist, Antoinette, and Commodore shades, e.g. Something I could've added for the colour scheme is more vibrant colours, for example with the Spring pattern pages I should've used a Spring colour palette shades such as pink, green, or yellow e.g.
This is the first practice page that I created for the 'Contact Us' page, I used pictures from Pinterest as a cover photo. The font and the font colour are really hard to read so I changed the colour from white to a darker shade so it's easier to see on a pink background.
Updated homepage guide, I changed the size and the font from 'Playfair display' to the font 'Space Grotesk'. It's easier and clearer to read rather than the old font I was using. To improve upon this further, I need to include the pattern and social media links on the headers to provide more information for my audience.
The 'Contact Us' header, looks kind of plain right now so I might add some Crochet motifs or my logo as decoration.
This is the logo that I'm using for my website, I'll put it on the 'About Us' page and the Homepage. I used Adobe Photoshop and InDesign's shape tools to create this, I also used this logo on my magazine projects. This shade of pink used on my logo is an ongoing theme since it's the same shade on my website too, a bubblegum pinkish shade.
Layout of my blog entries so far
I created a blog page for day 2 which includes the basics of learning how to Crochet, and a help guide to the easiest stitches, such as single and double stitches. For the pattern page images, I was thinking of using different yarn colours for the headers, e.g. Winter is blue and Spring is green. This would match the shade aesthetic of the different seasons, I would also need to replace some of the images with pictures of my own work, such as a bag or a hat that I've created. The FAQ page still needs to be completed with my own questions about Crochet or just navigating my website, here's an example of a format that I've come up with:
Q: How can I see the pattern archive from my devices?
A: To find the page with the patterns, simply click the 'Menu' option and there you'll see the 'Our patterns' on the 3rd page
Q: Are there any resources that I can access to find materials to introduce me to Crochet?
A: Yes, on my website, there's a wide range of resources that you can access to get you stuck in Crochet. My blog is beginner-friendly and has a special page for people new to crochet, I recommend looking at the HobbyCraft website as it's a great site to buy materials, such as Crochet hooks and yarn to get you started.
Q: Do you have any social media accounts, or an email if we want to get in contact with you for any questions or inquiries?
A: Colourful Crochet has Instagram, Twitter, and a Facebook account which you can follow by using the links on the 'About Us' page. Colourfulcroch3t@gmail.com is the email address you'll want to use if you can't find something or just have a suggestion for our site, we're open to new ideas!
Q: Do you have a guide for beginners? How to get started with materials, patterns, or Crochet stitches?
A: There's a blog entry created especially for beginners, it includes the basics of Crochet, the easiest stitches to get started with, and the yarn types you can use as well as the Crochet hook sizes that are recommended to use with them.
Q:
2nd blog entry, a guide for beginners
This is my blog page so far, the picture above is the second entry which is the basics of Crochet. I created a material guide, beginner patterns, different sizes of Crochet hooks, etc. I still need to add more information about the patterns so it's not confusing, I also need to add pictures as a visual of how it should look or a help guide of some sort. The blog pages will be on the homepage, to find it scroll past the main menu or navigate through the pages and it'll be titled 'Blog'. I used dates from each day of the week from last week, making it more realistic and posting one entry a day to start off. To improve my website as a whole, I need to replace the example pictures on the pattern page with my own ones to show my own Crochet sources instead of using the ones on Pinterest. I might also change the colour scheme since I need to figure out how to use the pink shade on my final website design. To create more of a visual element for my website, I'll add primary pictures of my Crochet projects.
I expect to make around 6-7 blog entries when I complete my site, to ensure that there's a good bit of information to add to my website. So far I have only 2 entries, I need to add more information about patterns, materials, and the Winter edition tutorials, such as the scarves, gloves, and hat patterns. The entry reading time/length should be around 5-6 minutes, adding pictures as a visual for my audience. For the patterns, I'll be using resources that I found on Google and crochet websites that have these provided patterns and I'll rewrite it using my own words and still give credit to the creators. At the end of every entry, I'll include the company website and social media links to increase the number of people who will look at my website.
Blog entry number 3, Crochet patterns for the Winter season. This entry is about wrapping up warm for winter by creating your own Crocheted accessories for the winter season. I included patterns, such as scarves, gloves, hats, and earmuffs with steps for beginners as well as the abbreviations for extra guidance. My favourite thing about my website is the blog pages. It gives my targeted audience a good sense of guidance about crocheting as the abbreviations and beginner patterns are also included.
Updated the 'Contact Us' page, I changed the address from Stanmore College to my own postcode and my area. I've also used a real phone number instead of the fake one, making it more realistic. The old font that I used was difficult to read so I replaced it with the font 'Futura' instead of using Playfair display.
My final piece for the area of interest - interactive is my website and my app. The theme of my interactive project is Crochet, I created this site for beginners and intermediate crocheters, and I used the free website builder, Wix. I chose to make my website about the topic of Crochet because crocheting is one of my hobbies and I thought it would be fun to create a website based on it. When I first started designing my website, I thought about the number of pages that I would like to add, initially 4 pages would be enough, but then I thought about the amount of information I would have to put on just one page so which led to me creating the 'FAQ' page. It answers any queries about my website and common questions that get asked on our website or about Crocheting in general. Something I liked when creating my website was the research, when making the blog entries I searched up the different hook and yarn types, including the one that a beginner should be using. It was fun looking at the Crochet projects and deciding which one would fit into the theme of my website the best. The logo that I created for my magazine designs was reused for my 'About us' page giving my viewers information about the company. I chose the best template that I thought would work for my site, I searched for a 'Blog' template and chose a basic template with primary colours. I couldn't find the initial template that I used for this website so I just wrote a vague description, the original template was green and white, and I then changed it to pink and white. I created 6 pages, naming them:
- Homepage
- About, when the company was established, why it was created, our motto and slogan e.g.
- Our patterns, the patterns included on my website range from seasonal patterns, such as winter accessories, hats, scarves, gloves, and earmuffs. It also has basic crochet stitches, single, double, and triple Crochet to get you started.
- A contact page, an email, social media accounts, and the company phone number as well as the address
- Frequently asked questions, could include questions about making your account, the pattern archive, where to start if you're new to Crochet, etc.
- Blog, the first blog entry is for beginners, it has patterns, materials linked, the easiest stitches, yarn and needle sizes, and the recommended hook that you should use when first Crocheting.
The colour scheme of my website changed from when I first started. At first, I used plain colours, such as white or cream but then I chose to match the colour theme of my app with the shades of baby pink and white. Most of my headers and borders are pink, but the home page is white, I think that this colour scheme goes well together with that shade of pink. For the homepage, I added the name of my company, Colourful Crochet in the font ' Playfair display' which is a recurring font on my website. When making my website, I most enjoyed making the blog entries, writing the patterns and linking the materials I used could be informative for my targeted audience. To improve on my blog page, I would've added more visual imagery since there are no pictures of Crochet on there and it might be good to visualise what the finished design might look like. To communicate my ideas for this website I used other Crochet websites for inspiration, my favourite websites to use for this were:
I chose these websites because their formats were structured, organised, and easy to navigate.
The homepage navigation for the Amigurumi website is well laid out, neatly arranged and has a simple design. I used this genre of websites to create my own, using a simple template yet it's still informative and organised.
This is a good example of a storefront. The arts and crafts company, Ribblr has an app and a website that allows users to sell their patterns or creations for free or at a price. There are different categories for crafts such as Crochet, Knitting, sewing, and Tunisian Crochet, making it easy for their audience to navigate their website based on the symbols.
The company logo was created in Photoshop. I previously used this for my magazine cover, spread, and the contents spread.
I think that the FAQ page on my website could've been done better, the design isn't the best that I could do and the questions need to be arranged more neatly. For the visual elements, I should've added more pictures of my own work instead of using the cover pictures to show a creative aspect to my audience. If I were to repeat this process again, I would definitely experiment with different colour schemes. I would use more vibrant colours, for the blog pages since you're quite limited when choosing the page colours. Wix probably isn't the best website builder to use if you want creative freedom with your website because of the option of fonts, some better alternatives for website builders that I would use are Squarespace and web.com. In my opinion, there aren't that many options when it comes to choosing the fonts since Wix has created their own and I would often have to use fonts that had already been used on previous pages. I couldn't change the colours of some of the sub-headers so that meant that it didn't match with the main headers. Although Wix has a wide range of templates and it's easy to navigate, I would've used a different app to create this website if I could do this process again. As for my 'About Me' page, I felt that it was lacking information, it was pretty basic so I feel like I could've added more to inform my audience about my website. The main picture on the page was the Colourful Crochet logo so maybe I should've used more pictures on the whole of my website to switch it up a bit.
App progress:
Updated 'Contact Us' page for my app, created on Adobe XD
Homepage icons
I used the shape tools on Adobe XD to create the house and the circle symbol. I used a basic colour palette such as a dark grey and a light pink shade to match the theme of my website as well as the app. For the circle symbol, I made the border thicker by changing the size from a size 1 to a size 6 to make it more visible. The colour scheme of my app could do with some more colour in my opinion, it's very plain and only uses two primary colours. I could've included some more vibrant colours that still are in the shade range of the pink colours. The plus button, which is the posting feature should've gone in the middle so that it's easier to make your own post
Colourful Crochet's profile page
I used a format from social media apps as a good idea of what this profile page should look like. I used a picture of my cat for the profile photo, adding the username, password and the signup or log-in option on the page too. I created a 'saved patterns' option for members who want to come back to their patterns after browsing on the app. I created a 'Forgotten Password?' option that gives you the option to reset your password if you get locked out, I made up a fake link with the name of my app included. Something that I would change is the app appearance button, the picture should've been a circular colour wheel so that it adds to the page's shape features. The size of this page is smaller than I would've liked it to be, making it harder to add words so which meant minimising the words and changing the font size and the font itself.
Pattern archive
I've been using the same icons for the bottom of the page for most of my app pages, to keep it consistent. For the pictures, I went with the theme of pink, using Crocheted tulips and a crocheted butterfly. The 'Mini bow bag pattern' is my own picture that I crocheted and the other pictures are downloaded from Pinterest, I might replace one of the pictures with my own to show how my own work turned out for my audience. Throughout my app, I've used the same font, Segoe UI on this particular page I used it in size 22 since there's enough space below the headers for extra space. For the search bar, I used the rectangular shape tool and minimised it so that there was no unneeded space on the rest of the bar. I used a basic font for both the search bar and the pattern archive title, Segoe UI, with light italics in font size 32. It could've been a bit more detailed in terms of the features on the homepage, and maybe the logo should be on top of the page near the search bar instead so more icons could be added.
App evaluation:
The final piece (2/2) for an Area of Interest - Interactive is my app. Crochet is the main theme in both of my pieces, I've used Adobe XD to create this. To start, I used the template iPhone 14 Pro Max and duplicated 6 pages on a white background. I then decided to change the colour of the pages using the fill tool, I changed the page background from white to a baby pink shade. I mostly used the shape tools to create the page details. For the widget icons, I used the rectangle and square tool to create the icons on the page bars. Something to consider when making my icons is to keep the shapes neat, the icons that I made were sloppy and could've been designed better so that they fit into my pages better. The colour scheme of my app goes off two colours, pink and grey, I would definitely explore using a range of different colours if I'm making an app next time, to expand my palette. I used the same font on all of the pages for my app, the font name Segoe UI.
These were my options for pink shades. I used Adobe colour to get all of these shades, FSC6DA is the closest colour match that I used for the background pages.
My first idea for my app was to create an arts and crafts app, such as Etsy but then I thought of creating an app for a smaller market, Crochet. Here's a Description of the app on pages:
First page: My first page is the homepage. I created an icon bar which includes, the 'save' button, the 'heart' button, and the 'create post' button which allows users to make their own posts whether it's patterns or just crafts content. I added my logo at the top of the page to make it the first thing that my audience sees when they open the app. I used the line tool to create 3 lines which acts as a navigation bar, where you can access all of the app content. For navigation, I also used the text tool to label the different parts of my app, e.g., 'about me', and 'contact us', but it could've been neater. The thing that I like about the first page is the colour scheme, the pink and white go well together. Something that I would do if I were to do it again is to make the Homepage more detailed, in my opinion, it looks bare and could do with some more information.
Third page: My third page is the 'Profile' page. When creating this page, I used a format from social media apps such as Instagram and Twitter. I started off with using the same pink background, I used the line tool to separate the icons from the main page. I also created an option to change the app's appearance using the colour wheel. Something that I like the most about creating this page is the creativity you get with changing your profile picture, giving my app users plenty of choices. I used the shape tool to create a circular shape on the page where the profile picture would go, for the picture I uploaded a picture of my cat and pasted it onto the shape. Here's a list of all of the text that I used for this page:
- Profile
Username, 123abc
Password: **********
- Saved patterns option, you can see all of the pattern histories that you've viewed including visual tutorials
- Messages
- Groups
- Sign up / login, if a user has forgotten their details they can reset their password by entering their email or phone information e.g. "Forgotten your password? click our link www.colourfulcrochet/forgottenpasswordresetlink.co.uk"
The final two pages are the 'About me', and the navigation 'guide' pages.
About me page
There isn't much to write about for these pages so I'm just going to evaluate them. The 'About me' page contains information about the Colourful Crochet company when it was established, our mission, why the company was started, etc. I wrote a short paragraph explaining this, including the company logo and used the shape tool to create a rectangular box to fit the words. For these pages, I would've gone into more detail, adding more information and using more of my own pictures to show the creative aspect of my app. In my opinion, these two pages are basic, there isn't really any colour and I feel like I could've used more shades to make this app stand out to my targeted audience.
No comments:
Post a Comment