Growing pains

While I come from a rojak or mixed career background centered in Graphic Design and have anticipated that UI/UX isn’t exactly the same thing, I did not prepare for the knots and curves in the process. If for a moment you think “Then be prepared next time,” well, let’s just say you never know what it is until it hits you. There’s only so much you can prepare for a certain amount of control. Old ways don’t work with new ways, and what happens then? You try something different. A new approach at tackling your thoughts or a new set of tools to design an outcome. To unlearn is like shedding years of skin and it comes with challenges that mimic pain but in a good way. This signifies growth and to be able to still experience growth, that should be celebrated.

Shifting & moving

Remember the bit about old ways not working with new ways? Well that depends on old ways that simply don’t work anymore vs old ways that are still applicable. The moment I realised that I had exactly zero experience in this new industry, I could have just sunk in the deep end but I chose to approach it from a different perspective. I began to wonder, what existing processes that I know of can still be applied here? What new skills have I not yet possessed and should be working on? Once I had the answers, I moved onwards. So let’s not sink until we acknowledge that our muscles remember how to swim.

One example of this being applied, I would say happened in my first few months. My experience isn’t exactly conventional. I had most of my hours dedicated to planning and learning things on my own. Some call it freedom, I call it responsibility for my own growth and that could have either dragged me down or kept me afloat. I did not have much involvement in projects early on and then came the Designer Maker Programme (DMP). Equipped with my previous ideation process, I mind-mapped and sketched. Armed with newfound UI and UX design knowledge, I turned sketches into wireframes, applied UI design principles, set a goal for the outcome and considered the user’s experience.

So what does it mean to be a work in progress?

If you’re highly critical of yourself and battle with inner thoughts of doubt, I feel you. Everyone faces challenges and tackles them differently while for me, it’s acknowledging that I’m still learning and it’s OKAY. Accepting that I’m a work in progress has helped me regulate throughout the apprenticeship. It’s a byproduct of the mentorship and guidance, an outcome of embracing failure and having the courage to experience it. Although I’m not immune to the critical moments of failure, now I have a way to regulate the state as it appears and that’s something I can always carry with me, no matter the stage of growth I am in.

Learnings & aspirations

There’s more than hard skills. You’re continually developing a new interest within the field, an exciting new tool or method, sharing and collaborating. It’s overall the foundation for one’s growth in design. Have your Dunning-Kreuger moments and fall into the valley of despair but work on getting out of it to reach the next peak. There are a lot of resources but if there’s something I can offer, it’s a book called “Just Enough Research” by Erika Hall, introduced to me by one of my mentors. It’s a great starter for me as someone who’s completely new to User Research and I often fall back into it from time to time. While it isn’t really a manual, I do flip the pages when I need clarity about research methods especially when it comes to either lesson exercises or projects like the case study.

The apprenticeship journey is not one size fits all and not every apprentice goes through the same outline. That’s where you come in and shape it. Have side quests to achieve like learning a new facet of design or thinking method, have boss fights like the DMP and case study where you blunder and tackle end to end. It is a malleable experience so go on and truly make it your own.

All in all, I’m excited about what the future holds for me. I’d like to focus on strengthening my core while exploring other avenues and will remember this apprenticeship as one of the pivotal moments in my career. Thank you Stampede for the experience and I hope to continue being a design explorer and learner wherever my path may be. If you’d like to know more about my journey or have any questions, do reach out to me on LinkedIn. I’m happy to have a chat.

Here’s to the unknown! 👏

Disclaimer: All the beautiful illustrations featured in this content are sourced from streamlinehq.com.

The post I’m a Work in Progress (& That’s Okay): An Apprentice’s Reflection appeared first on Stampede: the strategic design & technology company.

Envisioning a future in design talent

Aspiring designers hail from a variety of backgrounds. Some are recent graduates, while others have chosen a career switch to follow their passion for design. Our approach to giving aspiring designers the best start is through the Design Apprenticeship Programme. It’s a 6-month programme designed to equip apprentices with the necessary skills required to thrive as designers.

We are really excited about every apprenticeship batch, and our 4th and current cohort, Delta, is no exception. The diverse thoughts and experiences they bring from other disciplines enhance our ability to craft design solutions.

The boot camp

While we hope everyone can become apprentices, the reality is that we need to select the most promising candidates through a series of attritions. We start by evaluating their case studies, and based on this assessment, invite several candidates to our two-day boot camp. At the boot camp, participants delve into the core principles of design, establishing a solid foundation in design fundamentals.

During the boot camp, aspiring apprentices also have the opportunity to listen to and learn from the career journeys shared by past apprentices. They also gain insights from real conversations around design based on projects we’ve undertaken in the past.

This immersive experience not only prepares participants to tackle real-world design challenges but also provides our facilitators an opportunity for in-person evaluations. After the final round of assessment, a select group will be invited to join our six-month apprenticeship.

The right balance of theory and practice

The apprenticeship is designed to strike a balance between theoretical study and practical assignments. This allows apprentices to apply their newly acquired knowledge in real-world contexts and further solidify their design fundamentals.

As apprentices advance, they gradually join a project team under guidance, getting exposure to different UI/UX design processes depending on the nature of their assigned project.

Carving out a design career

Here’s what our apprentices can expect to learn in the apprenticeship:

• UI segment: Immersion into design theories such as design principles, typography, colours, and UI components, and actively apply these in real-world projects and assignments. We primarily use Figma, an industry-standard tool for UI design and prototyping. We provide basic instruction but also encourage exploration for a more profound understanding of the tool.
• UX segment: Exposure to a comprehensive UX process through individual projects, also known as case studies. This involves stakeholder interviews, prototyping, and user interviews to understand needs, as well as usability testing to verify design feasibility.

The success of our Apprenticeship Programme is measured not only by the skills acquired but also by the lasting impact it has on the careers of our alumni. We take pride in seeing our apprentices evolve into emerging leaders in the design industry, and we hope their positive influence resonates in every place and project they work on.

Interested in the 2024 Epsilon intake? Keep a lookout on our social media announcement! 

Congratulations to Rachel, Aini, Affan and Hanif for making it into our Delta apprentice class! We look forward to being colleagues and embark on the journey towards becoming industry leaders.

Meanwhile, watch our insightful post-event interview session featuring Delta Apprenticeship Boot Camp participants and special guests, where they shared with us how the boot camp has reshaped their creative perspectives and propelled them towards excellence and the profound impact that the Stampede Apprenticeship can have on nurturing future designers.

The post Delta Class: Growing Future Designers through Design Apprenticeships appeared first on Stampede: the strategic design & technology company.

As a UI/UX designer, your responsibility extends more than just pushing pixels behind your screen. The UI/UX discipline encompasses many umbrellas and you could be looking at fields such as human-computer interaction (HCI), usability, visual design, information architecture, interaction design and maybe in the future, more towards conversational design — especially the rise of chatbots and AI. Furthermore, a good UI/UX designer need to also be able to look not only at users’ perspectives, but also from a business’ end goal(s). 

It’s a wonderful time to be alive.

Personal attributes — as opposed to core skills — while might seem secondary, they could elevate yourself and your skills as a UI/UX designer, what’s with more and more companies been hiring waves of designers. They can help designers in large aspects of their work, from satisfying users, working with team members and dealing with stakeholders. These attributes can be learned, developed, encouraged and sharpened — provided you are up for them.

Personal attributes

Empathy

Realising empathy Four inter-related yet distinct processes that has to work together to make this process possible. By Seung Chan Lim.

Empathy is more than just a buzzword floating around. Empathy is described as the ability to understand and share feelings of another person — in other words, being able to put yourselves in other people’s shoes, thus being able to understand their feelings, motivations, limitations, biases and many others.

As a UI/UX designer, you need to be able to develop a sense of empathy to get very far in your career, as you need to be able to understand your users, your clients as well as being able to work with your teammates. Having a sense of empathy will lead to an improvement in a lot of areas. The book Design Collaboration for the Enterprise mentions that by having empathy, you can also improve collaboration.

Seung Chan Lim wrote a wonderful article on a thoughtful examination of empathy in life and in the context of design.

If you want to learn to become more empathetic, here are eight tips to do so.

Critical thinking

Connecting the dots The stage of critical thinking, from data accumulation all the way till wisdom formation. Photo from Gapingvoid.

The best designers are often thinking. More than just that, they know how to think effectively.

We now live among unprecedented abundance of information. The Internet offers us more than we could ever consume and shops offer us more choices than we could ever process. This information glut, coupled with our fast-paced lifestyle, contributes to our inability to filter information effectively, leading to lack of value in the work that we present ourselves in — because we tend to include everything in!

While this skill takes time to develop, there are some small steps you can take to sharpen it. For example, you may start to distinguish between user complaints or feedback during UX testing. During initial project briefing, start making small notes about the nature of the project, and why it would be different from the previous or current ones you are working on. For example, if the new project would require a new interface for a ridesharing app, you may start to think of why the UX would be different from the UX for a recipe sharing app you are currently working on.

Critical thinking is more than just filtering information. Two more subskills of critical thinking you could start to practice are being perceptive and having an eye for details. Technically, if you begin to start questioning “why?” to a lot of things, it is a good start. While surfing the web, you may also start to question why a certain website behaves the way it does, and how they do it. You can start by noticing microinteractions and compiling them, as the folks at Little Big Details do.

Lynda has a good short, one-hour course for critical thinking you could start on.

Hunger for knowledge

There is no prescribed path to becoming a good UI/UX designer. Some people we know do have the qualifications for them, some don’t — but what sets them apart is their willingness to always learn and improve themselves. The industry is constantly evolving and revolutionising. What’s good is that with Internet at the tip of our fingers these days, it is very easy to keep up with the trends.

One tip we often tell budding designers is just a one word mantra: read. There are many books out there offering UI/UX lessons from basic, technical all the way to the psychology of users. The only thing you have to do is keep looking.

Here are some good UI/UX books to start with:

• The Design of Everyday Things – Donald A. Norman
• Don’t Make Me Think – Steve Krug
• The Elements of User Experience – Jesse James Garrett
• About Face: The Essentials of Interaction Design – Alan Cooper, Robert Reimann, David Cronin, Christopher Noessel
• The UX Book – Rex Hartson and Pardha Pyla
• Lean UX: Applying Lean Principles to Improve User Experience – Jeff Gothelf and Josh Seiden
• The User Experience Team of One – Leah Buley

Patience

The initial section was to be called ‘passion’ — but I changed my mind. Very often we emphasise on the importance on passion for us to pursue what we want, without realising that like supernova, passion burns brightly and full of energy, only to burst and fade slowly. 

If you are a new UI/UX designer, there will be many occasions where the learning curve might get too steep you feel like quitting. Having the patience to know that any worthy skills take time to master will keep you grounded and put you back on track on your endeavour to become an excellent UI/UX designer.

Having the patience will also help you to be more grounded. In return, you will be more open to learn more (hunger for knowledge), understand others (empathy) and being able to fill in the gaps (perceptive) while constructing your solutions (critical thinking).

Don’t forget to also check out: So You Wanna Be a UI/UX Designer: Part 1 – Core Skills.

The post So You Wanna Be a UI/UX Designer: Part 2 appeared first on Stampede: the strategic design & technology company.

It has also been one of the biggest contributors to many success stories, for example — Jeff Bezos invested 100 times more into customer experience than advertising during the first year of Amazon, and AirBnB’s Mike Gebbia credits UX with taking the company to $10 billion.

Clearly, good user experience is good for business.

More so than ever, we are in need of more UI/UX designers to carry on this challenge. Undoubtedly not an easy role, UI/UX designers need to equip themselves with a certain sets of skills. Which brings to the next question— what sort of skills?

From our experiences, we could list down these skills in two categories — core skills (technical skills needed to excel as a UI/UX designer) and personal attributes (might seem secondary, but they are actually important to level yourself up to be a better UI/UX designer each day).

This week, let’s talk about core skills needed to become a UI/UX designer. Onward!

Core skills

User research

Bigger companies might have a dedicated team to perform user research, but it is important for a UI/UX designer to get herself involved in the research from the beginning. This could give her more insight into the nature of the business, get herself acquainted with the clients & their problems and how they behave — which actually could help with the direction of the design later.

Wireframing

Wireframing is the step which allows you to define the information hierarchy of your design, making it easier for you to plan the layout. It is as MVP as it can be in the design process, especially if you want to start designing and you want to confirm with the client or the team on the layout.  Once it is confirmed, it is actually faster to start designing since you already have the structure.

This beginner’s guide to wireframing is very helpful for you to start building your own guidelines.

Visual design

In order to transform the wireframes into mock ups, suffice to say you will need to have basic visual design skills. Our designers use Photoshop for this before getting the designs signed off and handed over to the development team, but best to check with the team you are working with on their preferences.

You might be thinking — “but I started with print design and I wanted to get into UI/UX, is it too late?” Absolutely not! There is an abundance of free UI/UX courses online you may find on Coursera, Hackdesign and many more. You may only need to start adapting your existing design practices to UI/UX. 

Prototyping

Prototyping can be defined as ‘a simulation or sample version of a final product, used for testing prior to launch.’ Prototypes are used to test products, fix issues and confirm requirements before sinking further into development. Prototype testing can save time and money since it can be used to identify earlier usability issues and reveal areas to be improved.

A lot of apps can be used to develop faster prototypes. Our team swears by InVision, but there are many others such as UXPin, Atomic and Sketch.

If you’d like to read more, UXPin here has a good article on a guide to prototyping.

Basic coding

We all hear of all these arguments floating about — “should designers learn how to code?”. The answer would be, “yes, but as much as possible to understand how development would work later.”

The designs done by UI/UX designers are eventually going to be translated into code, so it is helpful for UI/UX designers to know basic front end and programming knowledge. This is so that you could know what’s possible to be done before sending your design files to the developers without risking on their timelines or resources. It is vitally important, according to this discussion, that “UX folks have (at least) a theoretical understanding of “FE-related things”, including semantic page structure, optimization techniques, impact of JavaScript, graceful degradation/progressive enhancement, accessibility etc.”

Metrics and analytics

There is a possibility that user research will not be included in the scope of a project, so how do you start designing? First off, UI/UX designers do not design blindly. Your design decisions should be informed from experiential and data-driven decision.

UI/UX designers need to have some basic understanding on translating data so that we can use them to accomplish goals and achieve customer’s satisfactions. InVision has this good article on how to design with data.

Writing

In his annual Design in Tech report lead by John Maeda, he suggests that besides coding, the other one “unicorn” skill a designer should have would be writing. While many designers have noted the value of leading design with content, there are some others who are still persistent to start writing more due to many reasons. Well, we should not have.

Writing could also help immensely in articulating your design justifications to clients, or your team members. Furthermore, when you write, we empty up our mental estate in order to make way for more information to come through. We also remember better!

There is no magic to writing, and if you would like to start, here are some simple but powerful UX writing tips for designers.

Moving forward

Evidently, there is no shortcut to become a good UI/UX designer. Depends on your organisations or whether you work alone, sometimes not all of these skills are needed but it would be helpful to branch into all of these core skills as much possible.

After all, user advocation doesn’t take a day!

Next in Part 2: So You Wanna Be a UI/UX Designer : Personal Attributes.

(Thank you WOCinTech Chat for photos!)

The post So You Wanna Be a UI/UX Designer appeared first on Stampede: the strategic design & technology company.

(In case you are wondering, ELI5 = Explain Like I am Five.)

Big-O what?

In computer science we have the Big-O notation. It is a way to compare the complexity of an algorithm. An algorithm is defined by the how the code solves a problem and we want an algorithm that is fast. For programmers, sometimes it is useful to understand the concept of Big-O thoroughly to produce some examples in code.

To explain what the Big O notation is, let us do some simple algebra.

As we all know, in math, the most basic operations are:

• addition
• subtraction
• multiplication
• division

How does it work?

Say we have two numbers – 12345 and 56789. Since primary school if we were to add those two numbers up, we would first line the numbers up to the right then add each digits in the column from right to left. If each column exceeds 10, we add 1 to the left.

 12345
+56789
-------
 69134

The number of steps we take is about 5+ (including carrying 10 over). This means adding two 5 digits number takes about 5 steps.

What if we add two 10 digits number? That would take about 10 steps. Two 1000 digits number? 1000 steps.

So we can see a linear pattern here as the problem gets bigger. The complexity is directly proportional to the number of problem/digits (n digits) that we need to add up. Hence for an addition operation, we have a linear complexity. Or as we denote in the Big O notation, O(n).

The same complexity applies to subtraction as well.

For the case of multiplication, that is not linear though. The complexity of a multiplication operation is said to  be quadratic, O(n²). This is because for multiplication what we usually do is line the numbers up and multiply each numbers one by one. Then we add them up then move on to the left. So for multiplication two 6 digits number, we need to do 36 multiplication steps plus 10 or 11 additions to ge the end results.

As the problem gets bigger (more n digits), say multiplying two 100 digits numbers, we need 10,000 multiplication + 200 additions. Imagine if it gets really really big say 1 million digits. The multiplication steps will surely be even bigger while the additions could be big, but note that at this point, the additions step are now negligible. Which is why we said multiplication is a quadratic complexity O(n²).

This is another important part of the Big O notation. We only care about the significant portion of the complexity and algorithm.

Why do I need to know this?

The reason why we care about the Big-O notation and the complexity of the algorithm is because this affects the real world in a lot of ways. We always want to find the best case to use to search for answers in the fastest way. Not to mention saves up cost of computational power, resources and cost.

Finally, the two examples given only scratches the surface of the Big O notation. We still have in our hands the logarithmic complexity, constant complexity and factorial complexity which I will leave you guys to research more if you are interested in the subject of algorithm and optimization.

For a visual explanation on Big O, you can watch this video here.

(Image thanks to Sasa.)

The post ELI5: The Big-O Notation appeared first on Stampede: the strategic design & technology company.

This is Colossal

A website’s name serves as the first impression to attract users to visit regularly. In this case, This is Colossal is definitely easy to remember. The name is simple and catchy yet expresses the notion of grandeur the website offers.

The base colour of this website is dark greyish blue, which is nice because blue is my favourite colour (a little bit biased here). The other colour tones used in the website also reflect calmness, which makes me feels comfortable while I’m browsing about.

This is Colossal is also constantly updated with a variety of posts about arts, design, architecture, interior design and many more. The design is not fairly interesting, but it is simple and direct. The hierarchy is easy to figure out as it works from middle to left onward.

Header is the first thing that users usually see in a website. I like how the header is prominent, with the logo highly noticeable on top of the header picture. I also like how they differentiate search functions from navigation – the search bar is located at top right and the navigation is on top left with a with a contrasting yet complementing typeface.

Unlike other blog pages where related posts are located in between articles, This Is Colossal places their at the bottom, right before footer. This way, they eliminate distraction as user goes through the articles.

The sidebar is also non-obtrusive to allow focus on the website’s primary content.

Abduzeedo

According to the founder, Brazilian designer Fabio Sasso,

The blog’s name means ‘abducted’ in Portuguese. I changed its spelling from ‘abduzido’ to ‘abduzeedo’ so I could add the name of the company I founded in 2004, ZEE.

Just like This is Colossal, Abduzeedo is catchy and impossible to forget. I remember back when I was still studying, I always refers to this website for helpful tutorials and inspiration. At the time, it was still using the Zee logo.

As a student back then, my design resources were pretty limited. In my college, I was a little different from other design students. I have always wanted to do more than what I was assigned in school, but my knowledge of designing was far from robust. Abduzeedo has been my sources of tutorials and inspirations where I got to learn a few good designing techniques, even until now.

I love how each tutorial in Abduzeedo would show you different techniques to achieve the same results.

Posts are divided into categories such as tutorials, inspiration, wallpapers, interviews – making it very easy for users to locate what they’re looking for.

The header area changes constantly to highlight the latest featured posts. The factor that stays constant is the logo – it remains as the centerpiece together with the navigation.

The layout has a good, strategic eye-movement hierarchy. As each page is only limited to 8 posts, this makes it easier for users to digest the information comfortably. The website’s colour palette comprises of only 4 colours with yellow used for the footer logo. Placed in the footer, it anchors the whole bottom section and is a good design decision. If placed on the primarily white content area, the yellow might not pull sufficient contrast and would have been distracting to readers.

It also features a simple, yet distinct sidebar for social media buttons.

I also like the minimalistic search bar design, in which the bar will only appear when the magnifying glass icon is clicked.

What I like most is that based on the tutorials, you can post your artwork after learning from the tutorials. This actually encourages most new designers to get directly involved with the community as well as promoting their artwork.

Featured and news articles are located right above the footer. The news area displays more tutorials from other similar websites – widening the resource pool for designers.

The footer is centre-aligned which comes with two choices of language – English and Spanish. Fabio remains true to his heritage and demographics of his readers.

Karmaloop

My friend recently introduced me to Karmaloop and I have been a regular visitor since. It is an online shopping portal selling street clothes and brands I usually wear/like. Being a fan, I have made several purchases from the website itself.

Here’s one feature I really like: if you are a member and have items in your cart but did not complete your checkout, the website will subtly remind you the next time you are logged in. Pretty handy, huh?

On the homepage, featured items are placed on the left-hand side. On the right, you will see a sidebar showing new season collection, new items and new brands. Apart from having a name which is unique enough to remember, Karmaloop comes with a navigation where you can choose items to browse and purchase from categories such as brands, gender, on sale and many more.

Every week they will give away coupon vouchers that reinforces every promotional message. It is located right below the navigation – you certainly won’t miss it. These promotions include free shipping, 20% off for certain items and other offers that are difficult to resist.

The subscription form is obvious enough for you to notice, located right above featured items on the homepage. There are also social media sharing buttons so if you feel like sharing your finds on Facebook, you are free to do so!

Another useful feature is the filtering option. This is where you can sort items based on brands, types of clothing or from lowest price, highest price and more according to your interest. That’s always useful if you on a tight budget.

You can also zoom in the product photos to have a better view of the item before you finalize your purchase.

Karmaloop also has their own smartphone app, making it easier for me and other users to browse our favourite brands on the go. Sadly, a few brands featured in the website does not ship to Malaysia.

Conclusion

With the memorability assignment, I find that in order for websites to be memorable to me, it has to be any one of these: with quirky/ catchy names, easy navigation and also serves my personal interests.

For example, Karmaloop sells brands that I like, This Is Colossal supplies my daily dose of inspiration and Abduzeedo provides design tutorials useful to my profession. I’m positive I will find more exciting and unique features that makes a website memorable in future assignments. I will keep this thread updated.

What about you? What are the websites that are the most memorable to you, and why?

The post Memorable Websites: of Colossal, Being Abducted and Karma appeared first on Stampede: the strategic design & technology company.

These are amongst my favourites:

Stack Overflow

Deemed as the Quora for programmers, Stack Overflow is a site based on the concept of crowdsourcing where a user posts a question and will be answered by other users who have the knowledge. Free with no registration, this is the site where I first consult because most of the time, I would find the solutions here.

Smashing Magazine

With several categories such as Design, Mobile, UI/UX and loads more, Smashing Magazine is packed with interesting articles based around web design and development – which is not only useful for experienced designers and developers, but also for newbies and basically anyone who is interested in web development in general.

CSS Tricks

Owned by Chris Coyier, a designer at CodePen, CSS Tricks offer a lot of cutting edge techniques for use throughout the development process.

JS Fiddle

JS Fiddle is an open source javascript editor which offers you a canvas to try new stuff and share with people without the need to upload to your own server. It is good for experimenting, which I highly recommend.

A List Apart

A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. Like Smashing Magazine, the site provides a lot of good articles regarding web development. I could spend hours and hours here going through every article.

CSS Community

CSS Community is a special community for CSS Designing Discussion on Google+. Among the topics discussed are CSS techniques, tips, tricks and many more. Functioning as a community, the members would also help you if you have any issues regarding CSS.

CSS3 Generator

Instead of writing all CSS3 stuff manually one line after another, which can be time consuming after a while – why not give it a try at CSS3 Generator?

Colorzilla

ColorZilla is a Mozilla extension that assists web developers and graphic designers with color related and other tasks. Pretty handy to speed up the development process.

Have you got your own list and would like to share with us? Feel free to add them in the comments section!

The post 8 Useful Resources for Front-End Developers appeared first on Stampede: the strategic design & technology company.

Handcrafted CSS

Dan wrote everything inside this book based on CSS3 though it can easily merge with CSS5 in the future. He also covers ways to enriching web design using uncommon CSS3 properties and most importantly, how to render high-degree of style-consistency on every browser including IE6. In other words, Handcrafted CSS provides several ways to write CSS towards the same end result. There are 7 chapters in total, all covering CSS3 markups commonly used during web development with accompanying images for better details.

Chapter 1 covers a variety of styling the list element, particularly the <ul> element. Really simple modifications like font size adjustment, longer menu, floating, hovering treatment and positioning can lead to better, more usable listing style. This chapter also includes notes on how to change links into table and vice-versa.

Chapter 2 is all about “Rounded Corners”, deservedly so. It explains the handy property of border-radius on WebKit family browser (e.g Firefox and Safari). This method solves the problem of using of four extra <div> through the use of only one flexible rounded-corner box. With border-radius property, we can easily style flexible rounded input box – a frequent nightmare for many web developers. For me, I’m juts happy this method won’t screw other element and doesn’t require anything else besides CSS. The only downside is that it doesn’t work on IE7 and IE6, where all those sexy rounded corners and only shown as square, uninteresting boxes. I’ve also learned that twitter uses border-radius method.

RGBA is the main focus in Chapter 3. RGB stands for Red Green Blue – the color model that you can combine to create multitude hues – while RGBA stands for Red Green Blue and Alpha. This chapter will explain why there is an “alpha” value in RGB. In this chapter, Dan also show us how how to optimize color usage using CSS.

Chapter 4 covers text-shadow and box-shadow properties, again stuffs that are widely use by developers around the globe. Similar to “border-radius”, it eliminates the need to use any background image for the drop shadow effect. This means user can now easily change text and elements with drop-shadow on the fly.

Chapter 5 combines floating, stylesheet grouping, css framework and css reset. There are ways to tackle float, or known as “problem trigger”. The book suggests two solutions – clearing the float container and using single declaration for each element (will need long list css). It also shows the ways to to quarantine IE hacks and patches into developer’s own stylesheet. This chapter also discusses the two most popular frameworks at present: Blueprint and 960 Grid System. They are different but aims for the same objective – to make developers’ lives easier. The part about CSS reset covers essential things that you need to do to neutralize default css property values.

Chapter 6, The Fluid Grid is contributed by Ethan Marcotte and it elaborates more on the Grid System Framework. How to implement? What’s the problem expected to occur? Which browser doesn’t work? What is the solution? You’ll find pretty much everything about grid here.

Chapter 7 is dedicated to the details in web design craftsmanship. It discusses how typography can influence your design and gives valuable examples on how to make things more exciting for flash-like sliding animation using jQuery. Shifting backgrounds, collapsing/hiding image and the use of sliding bars are all new ways to sizzle up your web presence.

All in all, I have thoroughly enjoyed Handcrafted CSS. If you’re a front-end web developer or designer looking to harness CSS3 in your work, this book is a great start for you.

Handcrafted CSS: More Bulletproof Web Design
By Dan Cederholm and Ethan Marcotte.

The post Book Review: Handcrafted CSS appeared first on Stampede: the strategic design & technology company.

MIT’s motto isn’t Mens et Manus (Latin for Mind and Hand) by accident.

Excellent argument on why great knowledge is not the same as great skill by Michael Schrage of the Harvard Business Review.

The post Why Higher Education Is Overrated and Skills Aren’t appeared first on Stampede: the strategic design & technology company.