UI/UX With Asanda

UI/UX With Asanda

Share

Designing clean, human-first experiences ✨
UX/UI | Mobile & Web | Sri Lanka 🇱🇰
Let’s build something that works & feels good
#UXWithAsanda

18/10/2025

"Color Theory" කිව්වම සමහරුන්ට තාමත් ටිකක් 'serious' subject එකක් වගේ දැනෙනවා නේද? 😵‍💫

But honestly, ඒක එහෙම නෑ.

ඔයාගේ design එක "ලස්සන" වෙන එක විතරක් නෙවෙයි, user-ට "feel" වෙන විදිහ, එයාලා ඊළඟට මොකක්ද කරන්න ඕන කියලා guide කරන එකත් decide කරන්නේ Colors වලින්.

නිකම්ම "ලස්සන පාට" තෝරන එක පැත්තකින් තියලා, අපි බලමු කොහොමද පාට "smart" විදිහට use කරන්නේ කියලා.

1. Colors කියන්නේ Feelings (The Psychology 🧠)

User-ලා විදිහට අපි හැමෝම පාට වලට react කරනවා. ඒක අපේ brain එකේම wire වෙලා තියෙන්නේ.

🔵 Blue: මේක තමයි "Trust" (විශ්වාසය). Bank apps, Tech companies (LinkedIn, Facebook, Twitter) වගේ ගොඩක් දේවල් නිල් පාට වෙන්නේ ඒකයි. It feels secure and calm.

🟢 Green: "Success!" හරි "Go" හරි "Passed" කියන feeling එක දෙනවා. ඒ වගේම "Nature" (ස්වභාවධර්මය) සහ 'Health' (සෞඛ්‍යය) represent කරන්නත් use වෙනවා.

🔴 Red: දැක්ක ගමන් "Error!", "Stop!", "Urgent!" කියලා feel වෙනවා. It creates urgency. ඒ නිසා "Sale" banners වලටත් දානවා. හැබැයි පරිස්සමෙන් use කරන්න.

🟡 Yellow: "Happiness" සහ "Optimism" (සතුට) පෙන්නුවත්, digital design වලදී මේක "Warning" (අවවාදය) දෙන්නත් පාවිච්චි වෙනවා.

🟠 Orange: "Friendly", "Creative", "Enthusiasm". මේකත් user-ව action එකකට motivate කරන්න පුළුවන් නියම color එකක්.

⚫ Black: "Luxury", "Power", "Sophistication". Premium brands (like Apple) ගොඩක් වෙලාවට මේක use කරන්නේ ඒ vibe එක දෙන්න.

2. මගේ Favorite Trick: The 60-30-10 Rule

ඔයාගේ design එක අවුල් ජාලාවක් වගේ (cluttered) පේනවද? Balance නැද්ද? එහෙනම් මේ 60-30-10 rule එක use කරලා බලන්න. මේක game-changer එකක්.

60% (Main Color): මේක තමයි ඔයාගේ 'space' එක. ගොඩක් වෙලාවට White / Light Grey / Dark Grey (Dark Mode) වගේ neutral (උදාසීන) පාටක්. මේක ඔයාගේ canvas එක, design එකට "breathe" කරන්න ඉඩ දෙනවා.
30% (Secondary Color): මේක ඔයාගේ "supporting actor". Cards, info boxes, secondary buttons, navigation bars වගේ දේවල් වලට මේ පාට use කරන්න පුළුවන්.
It creates contrast.

10% (Accent Color): The Star of the Show! 🌟 මේක තමයි ඔයාගේ Call-to-Action (CTA) button ("Buy Now", "Sign Up"), වැදගත්ම link එක වගේ user-ගේ ඇහැ යන්නම ඕන තැන. මේක හොඳට pop-up වෙන, high-contrast color එකක් වෙන්න ඕන (උදා: Spotify වල Green 🟢).

3. The "Must-Do": Accessibility (Contrast)

මේක නම් අනිවාර්යයි! ‼️ ඔයා හිතන "minimal" look එක (උදා: ලා අළු background එකක සුදු පාට text) සමහරවිට ගොඩක් අයට කියවන්නම බෑ. 🥺
Always, always use a "Color Contrast Checker" (Figma plugins/web tools ඕන තරම් තියෙනවා).

WCAG guidelines වලට අනුව:
Text: සාමාන්‍ය Text එකට 4.5:1 contrast ratio එකක්වත් ඕන.
Icons / Buttons: Icons, button borders වගේ දේවල් වලට 3:1 ratio එකක්වත් ඕන.

Text විතරක් නෙවෙයි, user-ට click කරන්න තියෙන icons, form field borders පේන්නෙ නැත්නම්, ඒ design එක 'broken'. Everyone should be able to use your design, right?

කෙටියෙන්ම කිව්වොත්: ඊළඟ පාර design එකක් කරද්දි, නිකම්ම "ලස්සන පාටක්" දාන්නේ නැතුව, "මේ පාටෙන් user-ට මොකක්ද කියවෙන්නේ?", "මම 60-30-10 follow කරනවද?", "මේක හැමෝටම පේනවද?" කියලා පොඩ්ඩක් හිතලා දාන්න.

ඔයාලා use කරන favorite Accent Color එක (ඔය 10% එක) මොකක්ද? Comment එකක් දාගෙන යමු! 👇

Photos from Uxintace 's post 12/10/2025
Photos from UI/UX With Asanda's post 02/10/2025

🚀 Supercharging my design workflow with Figma plugins!

From speeding up repetitive tasks to enhancing creativity,
These tools make designing smarter and more efficient.

✨ As designers, it’s not just about creating beautiful interfaces—it’s about working faster, collaborating better, and delivering meaningful experiences.

Curious to know: Which Figma plugin do you use the most in your design process? 💡

30/08/2025

ව්‍යාපාරයක සාර්ථකත්වයට UI/UX සැලසුම්කරණයේ බලපෑම 🚀

අද වන විට සාර්ථක ව්‍යාපාරයක් ගොඩනැගීමේදී තාක්ෂණය අත්‍යවශ්‍ය සාධකයක් බවට පත්ව තිබෙනවා.

💻 ඔබ වෙබ් අඩවියක් හෝ ජංගම යෙදුමක් හරහා ඔබේ සේවාවන් හෝ නිෂ්පාදන ලබා දෙනවා නම්, එහි UI (User Interface) සහ UX (User Experience) යන අංග දෙක ඉතා වැදගත් වේ. මේවා එකිනෙකට සම්බන්ධ වුවත්, ඒවා නියෝජනය කරන දේ වෙනස් වේ.

🎨 UI (User Interface) - පෙනුම සහ දැනීම
UI යනු පරිශීලකයෙක් ඔබේ ඩිජිටල් නිෂ්පාදනය සමඟ අන්තර් ක්‍රියා කරන විට දකින සියලුම දෘශ්‍ය අංගයන්ය. ✨ එය නිෂ්පාදනයක "ඇඳුම" වගේ. එය ආකර්ශනීය, පැහැදිලි සහ හොඳින් සංවිධානය වූ එකක් විය යුතුයි.

UI එකකට ඇතුළත් වන ප්‍රධාන අංග:

* වර්ණ සහ ටයිපෝග්‍රැෆි (Colors & Typography): නිවැරදි වර්ණ සහ අකුරු තෝරා ගැනීමෙන් ඔබේ වෙළඳ නාමයේ අනන්‍යතාවය ඉස්මතු කළ හැකියි. 🌈

* බොත්තම් සහ අයිකන (Buttons & Icons): මේවා පැහැදිලිව හඳුනාගත හැකි සහ භාවිතා කිරීමට පහසු විය යුතුයි. 🖱️

* රූප සහ ග්‍රැෆික්ස් (Images & Graphics): උසස් තත්ත්වයේ රූප සහ ග්‍රැෆික්ස් මගින් නිෂ්පාදනයට වෘත්තීමය පෙනුමක් ලබා දේ. 🖼️

* සැකැස්ම (Layout): තොරතුරු පහසුවෙන් සොයාගත හැකි ලෙස සංවිධානය කර තිබිය යුතුයි. 🗺️

හොඳ UI එකක් මගින් ඔබේ නිෂ්පාදනය ආකර්ශනීය සහ ප්‍රියජනක පෙනුමක් ලබා දෙන අතර, එය භාවිතා කරන්නන්ගේ අවධානය දිනා ගනී. ❤️

💡 UX (User Experience) - සමස්ත අත්දැකීම
UX යනු ඔබේ නිෂ්පාදනය භාවිතා කිරීමේදී පරිශීලකයෙක් ලබන සමස්ත අත්දැකීමයි. එය නිෂ්පාදනයක් කොතරම් පහසු, ප්‍රයෝජනවත් සහ කාර්යක්ෂම දැයි තීරණය කරයි. එය හරියටම නිෂ්පාදනයක "ක්‍රියාකාරීත්වය" වැනිය.

⚙️හොඳ UX එකක ලක්ෂණ:

* ප්‍රයෝජනවත් බව (Usability): පරිශීලකයෙකුට අවශ්‍ය දේ පහසුවෙන් සොයාගෙන, එය ඉක්මනින් ඉටු කර ගැනීමට හැකිවීම. ✅

* ප්‍රවේශවීමේ හැකියාව (Accessibility): සියලුම පරිශීලකයන්ට (විශේෂ අවශ්‍යතා සහිත අය ඇතුළුව) නිෂ්පාදනය භාවිතා කිරීමට හැකිවීම. ♿

* කාර්යක්ෂමතාව (Efficiency): අඩු පියවර ගණනකින් කාර්යයක් සම්පූර්ණ කිරීමට හැකිවීම. ⚡

* විශ්වාසනීය බව (Trust): ගෙවීම් ක්‍රියාවලීන් වැනි සංවේදී දත්ත හසුරුවන අවස්ථාවලදී පද්ධතිය කෙරෙහි විශ්වාසයක් ඇතිවීම. 🔒

හොඳ UX එකක් මගින් පරිශීලකයාට ධනාත්මක සහ සතුටුදායක හැඟීමක් ලබා දෙන අතර, ඔවුන් නැවත පැමිණීමට පෙළඹේ.
😊

📈 ව්‍යාපාරයකට UI/UX අත්‍යවශ්‍ය වන්නේ ඇයි?

හොඳින් සැලසුම් කළ UI/UX එකක් ඔබේ ව්‍යාපාරයට පහත සඳහන් ප්‍රධාන ප්‍රතිලාභ ලබා දේ:

* පාරිභෝගික රඳවා ගැනීම (Customer Retention): හොඳ අත්දැකීමක් ලබන පාරිභෝගිකයන් නැවත ඔබේ නිෂ්පාදන භාවිතා කිරීමට වැඩි ඉඩක් ඇත. මෙය පාරිභෝගික පක්ෂපාතිත්වය (customer loyalty) වැඩි කරයි. 🤝

* ආදායම් වැඩිවීම (Increased Revenue): පරිශීලකයන්ට ඔබේ වෙබ් අඩවියෙන් භාණ්ඩ හෝ සේවා පහසුවෙන් මිලදී ගැනීමට හැකි නම්, "Cart Abandonment" (මිලදී ගැනීම අතහැර දැමීම) වැනි ගැටලු අඩු වී, විකුණුම් ඉහළ යයි. 💰

* වෙළඳ නාමයේ වටිනාකම (Brand Value): ගුණාත්මක පරිශීලක අත්දැකීමක් ඔබේ වෙළඳ නාමයට වෘත්තීමය සහ ගෞරවනීය ප්‍රතිරූපයක් ලබා දෙයි. එය තරඟකරුවන් අතරින් ඔබව කැපී පෙනෙන ලෙස ඉදිරියට ගෙන යයි. ✨

* පිරිවැය අඩු වීම (Reduced Costs): පරිශීලකයන්ට ඔබගේ නිෂ්පාදනය පහසුවෙන් භාවිතා කළ හැකි බැවින්, පාරිභෝගික සහාය සඳහා වැය වන කාලය සහ මුදල් අඩු වේ. 📉

🗺️ සාර්ථක UI/UX නිර්මාණයක් සඳහා අනුගමනය කළ යුතු පියවර 4ක්

* පර්යේෂණ (Research): ඔබේ ඉලක්කගත පරිශීලකයා කවුද, ඔවුන්ගේ අවශ්‍යතා සහ ගැටලු මොනවාද යන්න හොඳින් අධ්‍යයනය කරන්න. 🕵️

* සැලසුම් කිරීම (Planning): පරිශීලකයන්ගේ අවශ්‍යතා අනුව, ඔවුන් ඔබේ වෙබ් අඩවියේ හෝ යෙදුමේ ගමන් කරන මාර්ගය සැලසුම් කරන්න (User Flow). 📝

* නිර්මාණය (Design): පර්යේෂණ සහ සැලසුම් මත පදනම්ව ආකර්ශනීය සහ ක්‍රියාකාරී අතුරුමුහුණතක් නිර්මාණය කරන්න. 🖌️

* පරීක්ෂා කිරීම (Testing): ඔබේ නිර්මාණය සැබෑ පරිශීලකයන්ට භාවිතා කිරීමට දී, ඔවුන්ගේ ප්‍රතිචාර සහ යෝජනා අනුව අවශ්‍ය වෙනස්කම් සිදු කරන්න. 🧪

අවසාන වශයෙන්, UI/UX සැලසුම්කරණය යනු ඔබගේ ව්‍යාපාරයේ අනාගත ආයෝජනයකි. එය හුදෙක් නිෂ්පාදනයක් ලස්සන කිරීමක් නොව, ඔබේ පාරිභෝගිකයාගේ සිත දිනා ගනිමින් ව්‍යාපාරය දියුණු කරන ප්‍රධාන මෙවලමකි. එය නොසලකා හැරීමෙන් ඔබේ ව්‍යාපාරය තරඟයෙන් පිටතට තල්ලු වීමට ඉඩ තිබේ.

දිගටම මේ වගේ Articles සහ uiux ගැන update වෙන්න ජොයින් වෙන්න ..

Like, Comment , Share 💜️

Photos from UI/UX With Asanda's post 21/08/2025

Beauty Of Glassmorphism Trend Buttons 🖱️

One of my favourite trend 😋

19/08/2025

Medichen Web design By Asanda Imesha

Want your business to be the top-listed Advertising & Marketing Company in Colombo?
Click here to claim your Sponsored Listing.

Category

Address


Colombo
60000