supersushimi
supersushimi
DanLiu's Minipop WebSite.
4 posts
Mini Pops Website
Don't wanna be here? Send us removal request.
supersushimi · 7 years ago
Text
LOG
Wednesday, i compiled most of these note prior to the test.
W1 UI and XI stand for user interface and user experience they are huge growth industries. User centered design is Created for the for end use. User testing ie (falsifying)mental model of how things work.Folk theory and"wisdom of the crowd” both sort of mean how the river flows is how it will flow.
CRAP stands for Contrast, Repetition, alignment, proximity, all these elements i will try to put into practice into my picture gallery. and this to element, line, color, shape, text, form Negative
End game, narrow purposed design to be in control of the interface design Whats my end game, to “will” the user into my portfolio of design and ultimately choose me as there designer.
W2 Heuristics Principles. usability of system status Real world logical. Freedom undo and redo consistency error prevention# Recognition Flexibility Minimal Error handling. Documentation. = Happy users
Heuristic tests, expert reviews. me to carry out
Getting all this right will impact whether or not they choose me as a client.
W3 servers contain website data. Http stands for hypertext transfer protocol, computers use this to communicate with. Cascading style sheets are how elements are styled.
W4 This week we learnt about Root Folders and how websites are structured, this is important because it keeps all the files in the right places and makes it easy for other to interface with.
W5 Static, page specific with, stubborn layout, fixed with. Fluid, crunched all the way-to the with of the browser- not practical . Adaptive Static and adaptive with break points. Responsive design- fluid and adaptive, flexible, fluid, font changes spacing changes and breakpoints. Design for size not devices.
Why is all this important, new devices are being brought to market every day and how many older devices are there?
W6 Skewamorphic (old school) design.vs Flat design.
Redundant design incorporated into new. We learnt how to make buttons, dials, toggle slate. on off, checkbox list and Radio button list, Drop downs with multiple selections, single slider, Dual Slider.
Choose what is functional ! I like both, but for my website i might go for both in the menu page and the design work page.
W8 We learnt how to make GIFs in a seamless loop. here’s how, File. mov import. Video layer to PS. Take video Preview clip limit to every frame Make frame Animation Output. File export to web legacy. Boom.
W9 Low fidelity prototype For App testing. (paper and ink) For VI testing finding faults.
Benefits. 1 less time. 2 Design changes. 3 less pressure on user. 4 Desires feel less wadded to LFP 5 Stakeholders Recognize work isn't functional yet.
I particularly like LFP this really sparked my imagination.
Benefits in High fidelity Prototyping 1 Faster system response 2 interactivity and visuals, testing workflow. 3 live software to users more likely to behave realistically 4 focusing on test instead of what comes next. 5 Less likely to make human error
W10 Wire frames sketches of page layouts and solutions Clarifying a complex system with a graphic dynamic approach
Wire frame fidelity who what tasks tasks desired how are the tasks learnt where are the tasks performed relationships other tools for users how often tasks time constraints ⑥ what happens when something goes wrong.
I like the structured check list here, it puts the question out there What is the purpose of my web site.
W11 “gate way” CARP Rss,feed old tech packaged in unified form- subscription content, podcasts, reader views, social media,, notifications, Rss super limited
whats trending today. send to twitter passing the content.
(Api) another standard. APIS (Application Programming interface.) how interface M to M machine.
Api Page (Development page) security $ other developments. le Amazon. Widgets (plugins) POWR website  export into DW adds more features.
All useful tools to add functionality to your website.
W12 Ed Roberts made Curb Cut accessible (digital accessibility)
human dimensions. S, M, L → uniform etc.
SEO, do not forget this one, don’t want to get left behind the pack. FWI (Search Engine Optimization.
In conclusion my Design web site, i want to be first and foremost functional. My demographic will be individuals companies or prospective employees (designers) and interested individuals on social media platforms, all looking for the qualities that they require, hopefully my work will demonstrate technical expertise and a sound knowledge of design principles, typography, 2d and 3d, UI XI, photography color theory etc.
My pages will be comprised mainly of two forms the menu page and my design work pages.
Will my demographic be younger millennial, best bet probably not. In an article from "https://datausa.io/profile/soc/271020/#employment" stated that the average designers age is 40.5, so ill defiantly cater to these tastes, The male female split is relatively even so for males and females ill try my best to pull a few heart strings with my rubies cube and my mac emulated design.
Also in an article from dezeen.com they stated The "2016 Design Census revealed that 73 per cent of those surveyed identified as white, nine per cent were Hispanic, eight per cent were Asian, and three per cent were black.” Catering to white tastes might not be a stupid idea.
My competitors in today's digital age could be on any sort of platform twitter, Facebook, linked, Instagram, etc. What will put me ahead of the pack( clarity of what I’m about, and a clear message of innovation. I did say not millennial right ?, well these platforms like You Tube is the world’s second largest search engine and third most visited site after Google and Facebook, what do i think about that, it cant be ignored. Whats the answer make all these platforms work for all age demographics.
Testing my site i found that i need to set up my tables with a little more though to stop double handling my design work. I found google to be a good “how to in dream weaver” ie. making links into new pages etc and Bridge PS, ie like batch image processing these are both issues explode and resolved. Moving the image to the background to insure that the table of text was visible was also explored and resolved. Making buttons on an image was also explored and resolved also creating a new page and vs a link that stays on the same page also was researched and resolved.
How to make the page responsive i will attempt during my work, i hope to use this so my page will look and feel professional.
Ive got a lot to learn and a lot of ideas yet to come into reality. What i liked the most was the Low fidelity prototyping stages and nutting out problems and finding out what the user really wants. Learning all the ins and outs of DW was also enjoyable.
0 notes
supersushimi · 7 years ago
Text
AstroBoy MiniPops.
Mini pops i created the 3 mini pops in Photoshop and picked Astroboy, Astrogirl and the Professor as my three main characters. Here is the image i used to craft my characters.
Tumblr media
We created a root folder, images, big, and small for Dreamweaver and resized our mini pops using the web legacy option in Photoshop and also crated a transparent backdrop, background tile, in page properties. I revisited the instruction in on creating table and rows and inserting images and links where we mouse over our small mini pops and where the stage is the large mini pop appears, the reason i revisited this was because my first prototype page started to have a few glitches like, the small interactive mini pops were all not centred and i tried to fix this by creating a new layer and cutting and pasting into the centre, after that the mini pops were ultra small and illegible. The mouse over for Astroboy would also get stuck to on position, so i guess the HTML code got mashed up a bit, so i started again. Adding an extra link under Astro characters was fun and changing the colours and the way the underlining was changed on roll over. I didn’t play around much with the tiling of the background, but the one seen on the top of this page seems good for Astroboy and Astrogirl, but the professors light hair does not show up so well so i am going to choose something in a mid tone.
3 notes · View notes
supersushimi · 7 years ago
Text
Tumblr media
Here’s my site, i tried to edit the background to bring over the flying Astroboy but for some reason i could not edit the jpeg.
AstroBoy MiniPops.
Mini pops i created the 3 mini pops in Photoshop and picked Astroboy, Astrogirl and the Professor as my three main characters. Here is the image i used to craft my characters.
Tumblr media
We created a root folder, images, big, and small for Dreamweaver and resized our mini pops using the web legacy option in Photoshop and also crated a transparent backdrop, background tile, in page properties. I revisited the instruction in on creating table and rows and inserting images and links where we mouse over our small mini pops and where the stage is the large mini pop appears, the reason i revisited this was because my first prototype page started to have a few glitches like, the small interactive mini pops were all not centred and i tried to fix this by creating a new layer and cutting and pasting into the centre, after that the mini pops were ultra small and illegible. The mouse over for Astroboy would also get stuck to on position, so i guess the HTML code got mashed up a bit, so i started again. Adding an extra link under Astro characters was fun and changing the colours and the way the underlining was changed on roll over. I didn’t play around much with the tiling of the background, but the one seen on the top of this page seems good for Astroboy and Astrogirl, but the professors light hair does not show up so well so i am going to choose something in a mid tone.
3 notes · View notes
supersushimi · 7 years ago
Text
AstroBoy MiniPops.
Mini pops i created the 3 mini pops in Photoshop and picked Astroboy, Astrogirl and the Professor as my three main characters. Here is the image i used to craft my characters.
Tumblr media
We created a root folder, images, big, and small for Dreamweaver and resized our mini pops using the web legacy option in Photoshop and also crated a transparent backdrop, background tile, in page properties. I revisited the instruction in on creating table and rows and inserting images and links where we mouse over our small mini pops and where the stage is the large mini pop appears, the reason i revisited this was because my first prototype page started to have a few glitches like, the small interactive mini pops were all not centred and i tried to fix this by creating a new layer and cutting and pasting into the centre, after that the mini pops were ultra small and illegible. The mouse over for Astroboy would also get stuck to on position, so i guess the HTML code got mashed up a bit, so i started again. Adding an extra link under Astro characters was fun and changing the colours and the way the underlining was changed on roll over. I didn't play around much with the tiling of the background, but the one seen on the top of this page seems good for Astroboy and Astrogirl, but the professors light hair does not show up so well so i am going to choose something in a mid tone.
3 notes · View notes