AI ಯೊಂದಿಗೆ ಉತ್ತಮ ನೋಟದ ಆಪ್ ವಿನ್ಯಾಸ ಮಾಡುವುದು ಹೇಗೆ
AI ಯಿಂದ ಉತ್ತಮ ನೋಟದ ಆಪ್ ಪಡೆಯಲು, "ಚೆನ್ನಾಗಿ ಕಾಣುವಂತೆ ಮಾಡು" ಎಂದು ಕೇಳುವುದನ್ನು ನಿಲ್ಲಿಸಿ, ವಿನ್ಯಾಸಕಾರರು ಬಯಸುವುದನ್ನೇ ಕೊಡಿ: ನಿಮಗೆ ಇಷ್ಟವಾದ ಎರಡು-ಮೂರು ಉಲ್ಲೇಖಗಳು, ಹೆಸರಿಟ್ಟ ವಿನ್ಯಾಸ ದಿಕ್ಕು, ಮತ್ತು ಅಕ್ಷರ, ಬಣ್ಣ ಹಾಗೂ ಅಂತರದ ಕುರಿತ ಖಚಿತ ನಿಯಮಗಳು. ನಂತರ ಒಂದು ಪರದೆಯನ್ನು ಸರಿಯಾಗಿ ನಿರ್ಮಿಸಿ, ಅದು ಸರಿಯಾಗುವವರೆಗೆ ಸರಿಪಡಿಸಿ, ಮತ್ತು ಅದೇ ವ್ಯವಸ್ಥೆಯನ್ನು ಉಳಿದೆಲ್ಲೆಡೆ AI ಅನ್ವಯಿಸಲಿ. "AI ನೋಟ" ಹೆಚ್ಚಾಗಿ ಅಸ್ಪಷ್ಟ ಪ್ರಾಂಪ್ಟ್‌ಗಳಿಂದ ಸರಾಸರಿ ಉತ್ತರಗಳು ಬರುವುದರಿಂದ ಉಂಟಾಗುತ್ತದೆ; ನಿರ್ದಿಷ್ಟ ಇನ್‌ಪುಟ್ ನಿರ್ದಿಷ್ಟ ವಿನ್ಯಾಸವನ್ನು ನೀಡುತ್ತದೆ.
AI ವಿನ್ಯಾಸಗಳು ಸಾಮಾನ್ಯವಾಗಿ ಏಕೆ ಒಂದೇ ರೀತಿ ಕಾಣುತ್ತವೆ
AI ಗೆ "ಆಧುನಿಕ, ಸ್ವಚ್ಛ SaaS ಡ್ಯಾಶ್‌ಬೋರ್ಡ್" ಎಂದು ಕೇಳಿದರೆ, ಅದು ಈವರೆಗೆ ನೋಡಿರುವ ಪ್ರತಿಯೊಂದು ಡ್ಯಾಶ್‌ಬೋರ್ಡ್‌ನ ಸರಾಸರಿ ರೂಪವನ್ನು ನೀಡುತ್ತದೆ: ಅದೇ ಸಾನ್ಸ್-ಸೆರಿಫ್ ಫಾಂಟ್, ನೇರಳೆಯಿಂದ ನೀಲಿಗೆ ಹೋಗುವ ಗ್ರೇಡಿಯಂಟ್, ನೆರಳು ಇರುವ ದುಂಡು ಕಾರ್ಡ್‌ಗಳು, ವೃತ್ತಗಳಲ್ಲಿ ಇಟ್ಟ ಐಕಾನ್‌ಗಳು ಮತ್ತು "Your workflow, simplified" ಎಂಬ ಮಧ್ಯದ ಹೀರೋ ಶೀರ್ಷಿಕೆ. ಇವುಗಳಲ್ಲಿ ಯಾವ ಆಯ್ಕೆಯೂ ತಪ್ಪಲ್ಲ. ಸಮಸ್ಯೆ ಏನೆಂದರೆ, ಯಾವುದೂ ನಿಮ್ಮ ಉತ್ಪನ್ನಕ್ಕಾಗಿ ಆಯ್ಕೆಯಾಗಿಲ್ಲ.
ಉತ್ತಮ ವಿನ್ಯಾಸ ಮುಖ್ಯವಾಗಿ ನಿರ್ಧಾರಗಳ ಸರಣಿ. ಆಪ್‌ಗೆ ಒಂದು ವ್ಯಕ್ತಿತ್ವ ನೀಡುವ ಕೆಲವು ನಿರ್ಧಾರಗಳನ್ನು ನೀವು ಮಾಡಿ, ಸಾವಿರಾರು ಸಣ್ಣ ನಿರ್ಧಾರಗಳನ್ನು AI ಸ್ಥಿರವಾಗಿ ಮಾಡಲಿ.
ಹಂತ 1: ಪ್ರಾಂಪ್ಟ್ ಮಾಡುವ ಮೊದಲು ಉಲ್ಲೇಖಗಳನ್ನು ಸಂಗ್ರಹಿಸಿ
ನಿಮ್ಮ ಉತ್ಪನ್ನಕ್ಕೆ ಸರಿಹೊಂದುವ ಎರಡರಿಂದ ನಾಲ್ಕು ಉಲ್ಲೇಖಗಳನ್ನು, ಅಂದರೆ ಆಪ್‌ಗಳು ಅಥವಾ ವೆಬ್‌ಸೈಟ್‌ಗಳನ್ನು ಸಂಗ್ರಹಿಸಲು ಇಪ್ಪತ್ತು ನಿಮಿಷ ಮೀಸಲಿಡಿ. ನಿಮ್ಮ ಪ್ರೇಕ್ಷಕರು ಈಗಾಗಲೇ ಬಳಸುವ ಉತ್ಪನ್ನಗಳು, ವಿನ್ಯಾಸ ಗ್ಯಾಲರಿಗಳು ಮತ್ತು ಸಂಬಂಧಿತ ಕ್ಷೇತ್ರದ ಕಂಪನಿಗಳ ಸೈಟ್‌ಗಳು ಉತ್ತಮ ಮೂಲಗಳು.
ಪ್ರತಿಯೊಂದರಲ್ಲಿ ನಿಮಗೆ ಯಾವುದು ಇಷ್ಟವೆಂದು ಸರಳ ಪದಗಳಲ್ಲಿ ಬರೆಯಿರಿ:
- "ಬಹಳಷ್ಟು ಖಾಲಿ ಜಾಗ, ವಿಷಯ ಕಿರಿದಾದ ಕಾಲಮ್‌ನಲ್ಲಿ, ದೊಡ್ಡ ಸಂಖ್ಯೆಗಳ ಮೇಲೆ ಸಣ್ಣ ಬೂದು ಲೇಬಲ್‌ಗಳು."
- "ತೆಳುವಾದ ಗೆರೆಗಳ ದಟ್ಟ ಕೋಷ್ಟಕಗಳು, ಕಾರ್ಡ್ ನೆರಳುಗಳಿಲ್ಲ, ಕ್ರಿಯೆಗಳಿಗೆ ಒಂದೇ ಉಚ್ಚಾರಣಾ ಬಣ್ಣ."
- "ದೊಡ್ಡ ಸೆರಿಫ್ ಶೀರ್ಷಿಕೆಗಳು, ಬೆಚ್ಚಗಿನ ಆಫ್-ವೈಟ್ ಹಿನ್ನೆಲೆ, ಚಿತ್ರಣಗಳ ಬದಲು ಛಾಯಾಚಿತ್ರಗಳು."
ಈ ವಿವರಣೆಗಳನ್ನು AIಗೆ ನೀಡಿ, ಸಾಧ್ಯವಿದ್ದರೆ ಸ್ಕ್ರೀನ್‌ಶಾಟ್‌ಗಳನ್ನೂ ಲಗತ್ತಿಸಿ. ಉತ್ಪನ್ನದ ಗುಣಮಟ್ಟವನ್ನು ಸ್ಫೂರ್ತಿಯಾಗಿ ಪಡೆಯಿರಿ, ಉತ್ಪನ್ನವನ್ನು ಅಲ್ಲ: ಬೇರೊಂದು ಕಂಪನಿಯ ಲೇಔಟ್, ಬ್ರ್ಯಾಂಡಿಂಗ್ ಅಥವಾ ಪಠ್ಯವನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ನಕಲು ಮಾಡುವುದು ಕಾನೂನು ಮತ್ತು ವಿಶ್ವಾಸಾರ್ಹತೆಯ ಅಪಾಯ.
ಹಂತ 2: ವಿನ್ಯಾಸ ದಿಕ್ಕನ್ನು ಆಯ್ಕೆಮಾಡಿ ಮತ್ತು ಹೆಸರಿಡಿ
ವಿನ್ಯಾಸ ದಿಕ್ಕು ಎಂದರೆ ಶೈಲಿಯ ಕುರಿತ ಸಣ್ಣ ವಿವರಣೆ. ಇದು AI ಪ್ರತಿ ನಿರ್ಧಾರಕ್ಕೆ ಒಂದು ಫಿಲ್ಟರ್ ಆಗುತ್ತದೆ. ಚೆನ್ನಾಗಿ ಕೆಲಸ ಮಾಡುವ ಕೆಲವು ದಿಕ್ಕುಗಳು:
| ದಿಕ್ಕು | ಸಾಮಾನ್ಯ ಆಯ್ಕೆಗಳು | ಯಾವುದಕ್ಕೆ ಸೂಕ್ತ |
|---|---|---|
| ಶಾಂತ ಮತ್ತು ಕನಿಷ್ಠ | ತಟಸ್ಥ ಪ್ಯಾಲೆಟ್, ಉದಾರ ಅಂತರ, ಒಂದು ಉಚ್ಚಾರಣಾ ಬಣ್ಣ, ತೆಳು ಗಡಿಗಳು | ಉತ್ಪಾದಕತೆ ಉಪಕರಣಗಳು, ಹಣಕಾಸು, ಆರೋಗ್ಯ |
| ಸಂಪಾದಕೀಯ | ಸೆರಿಫ್ ಶೀರ್ಷಿಕೆಗಳು, ಬಲವಾದ ಅಕ್ಷರ ವ್ಯತ್ಯಾಸ, ದೊಡ್ಡ ಚಿತ್ರಗಳು, ಕಿರಿದಾದ ಪಠ್ಯ ಕಾಲಮ್‌ಗಳು | ಪೋರ್ಟ್‌ಫೋಲಿಯೋಗಳು, ಪ್ರಕಟಣೆಗಳು, ಪ್ರೀಮಿಯಂ ಸೇವೆಗಳು |
| ದಟ್ಟ ಮತ್ತು ಕ್ರಿಯಾತ್ಮಕ | ಸಣ್ಣ ಸಾಲುಗಳು, ಸಣ್ಣ ಅಕ್ಷರಗಳು, ಕೋಷ್ಟಕಗಳು, ಕೀಬೋರ್ಡ್ ಸ್ನೇಹಿ | ಆಂತರಿಕ ಉಪಕರಣಗಳು, ಡ್ಯಾಶ್‌ಬೋರ್ಡ್‌ಗಳು, ಅಡ್ಮಿನ್ ಪ್ಯಾನಲ್‌ಗಳು |
| ಬೆಚ್ಚಗಿನ ಮತ್ತು ಸ್ನೇಹಪರ | ದುಂಡು ಆಕಾರಗಳು, ಮೃದು ಬಣ್ಣಗಳು, ಚಿತ್ರಣಗಳು, ದೊಡ್ಡ ಸ್ಪರ್ಶ ಗುರಿಗಳು | ಗ್ರಾಹಕ ಆಪ್‌ಗಳು, ಸಮುದಾಯ, ಶಿಕ್ಷಣ |
| ದಿಟ್ಟ ಮತ್ತು ಗ್ರಾಫಿಕ್ | ಹೆಚ್ಚಿನ ಕಾಂಟ್ರಾಸ್ಟ್, ದೊಡ್ಡ ಅಕ್ಷರಗಳು, ಸಮತಟ್ಟಾದ ಬಣ್ಣ ಬ್ಲಾಕ್‌ಗಳು | ಕಾರ್ಯಕ್ರಮಗಳು, ಬಿಡುಗಡೆಗಳು, ಸೃಜನಶೀಲ ಬ್ರ್ಯಾಂಡ್‌ಗಳು |
ಇದನ್ನು ಮೊದಲ ಪ್ರಾಂಪ್ಟ್‌ನಲ್ಲಿ, ಆಪ್ ಯಾರಿಗಾಗಿ ಎಂಬುದರೊಂದಿಗೆ ಹಾಕಿ:
ಸ್ವತಂತ್ರ ಯೋಗ ಸ್ಟುಡಿಯೋಗಾಗಿ ಬುಕಿಂಗ್ ಆಪ್ ನಿರ್ಮಿಸಿ. ವಿನ್ಯಾಸ ದಿಕ್ಕು: ಶಾಂತ ಮತ್ತು ಕನಿಷ್ಠ, ಮುದ್ರಿತ ಸ್ಟುಡಿಯೋ ವೇಳಾಪಟ್ಟಿಯಂತೆ. ಬೆಚ್ಚಗಿನ ಆಫ್-ವೈಟ್ ಹಿನ್ನೆಲೆ, ಬಹುತೇಕ ಕಪ್ಪು ಪಠ್ಯ, ಬಟನ್‌ಗಳು ಮತ್ತು ಆಯ್ಕೆಯಾದ ಸ್ಥಿತಿಗಳಿಗೆ ಒಂದು ಮಂದ ಸೇಜ್-ಹಸಿರು ಉಚ್ಚಾರಣೆ. ಶೀರ್ಷಿಕೆಗಳಿಗೆ ಸೆರಿಫ್, ಪಠ್ಯಕ್ಕೆ ಸ್ವಚ್ಛ ಸಾನ್ಸ್-ಸೆರಿಫ್. ಉದಾರ ಅಂತರ, ಗ್ರೇಡಿಯಂಟ್ ಇಲ್ಲ, ಡ್ರಾಪ್ ನೆರಳು ಇಲ್ಲ, ಎಮೋಜಿ ಇಲ್ಲ. ಮೊಬೈಲ್-ಮೊದಲು.
ಹಂತ 3: ನಿಯಮಗಳನ್ನು ಹಾಕಿ: ಅಕ್ಷರ, ಬಣ್ಣ ಮತ್ತು ಅಂತರ
ಈ ಮೂರೂ ದೃಶ್ಯ ಗುಣಮಟ್ಟದ ಬಹುಭಾಗವನ್ನು ನಿರ್ಧರಿಸುತ್ತವೆ. ಇವುಗಳ ಬಗ್ಗೆ ಸ್ಪಷ್ಟವಾಗಿ ಹೇಳುವುದು ನೀವು ಮಾಡಬಹುದಾದ ಅತಿ ದೊಡ್ಡ ಸುಧಾರಣೆ.
ಅಕ್ಷರ ವಿನ್ಯಾಸ
- ಒಂದು ಅಥವಾ ಎರಡು ಟೈಪ್‌ಫೇಸ್‌ಗಳು. ಶೀರ್ಷಿಕೆಗೆ ಒಂದು ಮತ್ತು ಪಠ್ಯಕ್ಕೆ ಒಂದು, ಅಥವಾ ಒಂದೇ ಕುಟುಂಬದ ವಿವಿಧ ತೂಕಗಳು.
- ಅಕ್ಷರ ಮಾಪಕ. ಸ್ಥಿರವಾಗಿ ಬಳಸುವ ಕೆಲವು ಗಾತ್ರಗಳು, ಉದಾಹರಣೆಗೆ 14, 16, 20, 28 ಮತ್ತು 40 px, ಪ್ರತಿ ಘಟಕ ತನ್ನದೇ ಆಯ್ಕೆ ಮಾಡುವ ಬದಲು.
- ಓದಲು ಸುಲಭವಾದ ಪಠ್ಯ. ವೆಬ್‌ನಲ್ಲಿ ಸುಮಾರು 16 px, ಸುಮಾರು 1.5 ಸಾಲು ಎತ್ತರ, ಮತ್ತು ದೀರ್ಘ ಪಠ್ಯಕ್ಕೆ ಸುಮಾರು 60–75 ಅಕ್ಷರಗಳ ಸಾಲು ಉದ್ದ.
- ಶ್ರೇಣಿ ತೂಕ ಮತ್ತು ಗಾತ್ರದ ಮೂಲಕ, ಬಣ್ಣದ ಮೂಲಕವಲ್ಲ. ಶೀರ್ಷಿಕೆಗಳು ದಪ್ಪ ಮತ್ತು ದೊಡ್ಡವಾಗಿ; ದ್ವಿತೀಯ ಪಠ್ಯ ಸಣ್ಣದಾಗಿ ಮತ್ತು ಮೃದು ಬೂದು ಬಣ್ಣದಲ್ಲಿ.
ಬಣ್ಣ
- ಬಹುತೇಕ ತಟಸ್ಥ ಬಣ್ಣಗಳು. ಹಿನ್ನೆಲೆ, ಮೇಲ್ಮೈಗಳು, ಗಡಿಗಳು ಮತ್ತು ಪಠ್ಯದ ಬೂದು ಛಾಯೆಗಳೇ ಬಹುತೇಕ ಕೆಲಸ ಮಾಡುತ್ತವೆ.
- ಕ್ರಿಯೆಗಳು ಮತ್ತು ಆಯ್ಕೆಯಾದ ಸ್ಥಿತಿಗಳಿಗೆ ಒಂದು ಉಚ್ಚಾರಣಾ ಬಣ್ಣ. ಎರಡನೆಯದು ಸ್ಪಷ್ಟ ಕೆಲಸವಿದ್ದರೆ ಮಾತ್ರ.
- ಅರ್ಥಪೂರ್ಣ ಬಣ್ಣಗಳು ಯಶಸ್ಸು, ಎಚ್ಚರಿಕೆ ಮತ್ತು ದೋಷಕ್ಕಾಗಿ — ಮತ್ತು ಅವುಗಳಿಗಷ್ಟೇ ಬಳಸಿ.
- ಕಾಂಟ್ರಾಸ್ಟ್. WCAG 2 ಸಾಮಾನ್ಯ ಪಠ್ಯಕ್ಕೆ ಕನಿಷ್ಠ 4.5:1 ಮತ್ತು ದೊಡ್ಡ ಪಠ್ಯಕ್ಕೆ 3:1 ಕಾಂಟ್ರಾಸ್ಟ್ ಅನುಪಾತವನ್ನು ಕೇಳುತ್ತದೆ. ಬಿಳಿ ಹಿನ್ನೆಲೆಯ ಮೇಲೆ ತಿಳಿ ಬೂದು ಪಠ್ಯ ಹೆಚ್ಚಾಗಿ ವಿಫಲವಾಗುತ್ತದೆ; AIಯನ್ನು ಪರಿಶೀಲಿಸಲು ಹೇಳಿ.
- ಡಾರ್ಕ್ ಮೋಡ್, ನೀವು ಬಯಸಿದರೆ, ಸರಳವಾಗಿ ತಿರುಗಿಸುವ ಬದಲು ಉದ್ದೇಶಪೂರ್ವಕವಾಗಿ ವಿನ್ಯಾಸಗೊಳಿಸಿ.
ಅಂತರ ಮತ್ತು ಲೇಔಟ್
- ಅಂತರದ ಮಾಪಕ, ಉದಾಹರಣೆಗೆ 4, 8, 12, 16, 24, 32, 48, 64 px. ಎಲ್ಲವೂ ಈ ಮಾಪಕಕ್ಕೆ ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ.
- ಜೋಡಣೆ. ಅಂಚುಗಳು ಸಾಲಾಗಿರಲಿ; ವಿಷಯ ಒಂದು ಗ್ರಿಡ್‌ನಲ್ಲಿ ಅಥವಾ ಸ್ಥಿರ ಗರಿಷ್ಠ ಅಗಲದ ಕಾಲಮ್‌ನಲ್ಲಿರಲಿ.
- ಸಾಮೀಪ್ಯ. ಸಂಬಂಧಿತ ಅಂಶಗಳು ಹತ್ತಿರ, ಸಂಬಂಧವಿಲ್ಲದವು ದೂರ. ಈ ಒಂದೇ ನಿಯಮ ಹೆಚ್ಚಿನ ಗೊಂದಲಮಯ ಪರದೆಗಳನ್ನು ಸರಿಪಡಿಸುತ್ತದೆ.
- ಕಡಿಮೆ ಕಂಟೇನರ್‌ಗಳು. ಎಲ್ಲವಕ್ಕೂ ಕಾರ್ಡ್ ಬೇಕಿಲ್ಲ. ಗಡಿಗಳು, ವಿಭಜಕ ಗೆರೆಗಳು ಮತ್ತು ಖಾಲಿ ಜಾಗ ವಿಷಯವನ್ನು ಹೆಚ್ಚು ಮೃದುವಾಗಿ ಗುಂಪು ಮಾಡುತ್ತವೆ.
ವ್ಯವಸ್ಥೆಯನ್ನು ಒಮ್ಮೆ ಹೊಂದಿಸುವ ಪ್ರಾಂಪ್ಟ್:
ಇನ್ನಷ್ಟು ಪರದೆಗಳನ್ನು ನಿರ್ಮಿಸುವ ಮೊದಲು ಒಂದು ಸಣ್ಣ ಡಿಸೈನ್ ಸಿಸ್ಟಮ್ ಹೊಂದಿಸಿ ಮತ್ತು ಎಲ್ಲೆಡೆ ಬಳಸಿ: ಅಕ್ಷರ ಮಾಪಕ 14/16/20/28/40 px, ಪಠ್ಯ ಸಾಲು ಎತ್ತರ 1.5, ಅಂತರ ಮಾಪಕ 4/8/12/16/24/32/48 px, ಬಹುತೇಕ ಬಿಳಿಯಿಂದ ಬಹುತೇಕ ಕಪ್ಪಿನವರೆಗಿನ ತಟಸ್ಥ ಬಣ್ಣಗಳು, ಪ್ರಾಥಮಿಕ ಕ್ರಿಯೆಗಳಿಗೆ ಮಾತ್ರ ಒಂದು ಉಚ್ಚಾರಣಾ ಬಣ್ಣ (#3F6B5A), ಮತ್ತು ದೋಷಗಳಿಗೆ ಮಾತ್ರ ಕೆಂಪು. ಬಟನ್‌ಗಳು, ಇನ್‌ಪುಟ್‌ಗಳು ಮತ್ತು ಕಾರ್ಡ್‌ಗಳು ಒಂದೇ ಮೂಲೆಯ ತ್ರಿಜ್ಯವನ್ನು ಹಂಚಿಕೊಳ್ಳಲಿ. ಎಲ್ಲಾ ಪಠ್ಯ WCAG AA ಕಾಂಟ್ರಾಸ್ಟ್ ಪೂರೈಸುತ್ತದೆಯೇ ಎಂದು ಪರಿಶೀಲಿಸಿ.
ಕೋಡ್ ಆಧಾರಿತ ಬಿಲ್ಡರ್‌ನಲ್ಲಿ ಕೆಲಸ ಮಾಡುತ್ತಿದ್ದರೆ, ಇದು ಸಾಮಾನ್ಯವಾಗಿ ಡಿಸೈನ್ ಟೋಕನ್‌ಗಳಾಗಿ ಬದಲಾಗುತ್ತದೆ — CSS ವೇರಿಯಬಲ್‌ಗಳು ಅಥವಾ Tailwind ಥೀಮ್ — ಅಂದರೆ ನಂತರದ ಬದಲಾವಣೆಗಳು ಒಂದೇ ಸ್ಥಳದಲ್ಲಿ ಆಗುತ್ತವೆ.
ಹಂತ 4: ಮೊದಲು ಒಂದು ಪರದೆಯನ್ನು ಸರಿಯಾಗಿ ಮಾಡಿ
ಹನ್ನೆರಡು ಪರದೆಗಳನ್ನು ಒಮ್ಮೆಲೇ ರಚಿಸಿ ನಂತರ ಎಲ್ಲವನ್ನೂ ಸರಿಪಡಿಸಲು ಹೋಗಬೇಡಿ. ಬಳಕೆದಾರರು ಹೆಚ್ಚು ನೋಡುವ ಪರದೆಯನ್ನು ಆರಿಸಿ — ಸಾಮಾನ್ಯವಾಗಿ ಡ್ಯಾಶ್‌ಬೋರ್ಡ್ ಅಥವಾ ಮುಖ್ಯ ಪಟ್ಟಿ — ಅದು ಸರಿಯಾಗುವವರೆಗೆ ಪುನರಾವರ್ತಿಸಿ. ನಂತರ:
ಇತರ ಎಲ್ಲಾ ಪುಟಗಳಿಗೆ ಡ್ಯಾಶ್‌ಬೋರ್ಡ್ ಅನ್ನು ಉಲ್ಲೇಖವಾಗಿ ಬಳಸಿ: ಅದೇ ಹೆಡರ್, ಅಂತರ, ಅಕ್ಷರ ಗಾತ್ರಗಳು, ಬಟನ್ ಶೈಲಿಗಳು ಮತ್ತು ಕೋಷ್ಟಕ ಶೈಲಿ. Settings ಮತ್ತು Bookings ಪುಟಗಳನ್ನು ಅದಕ್ಕೆ ಹೊಂದುವಂತೆ ನವೀಕರಿಸಿ.
ಪೂರ್ಣಗೊಂಡ ಉಲ್ಲೇಖ ಪರದೆಯು ಯಾವುದೇ ವಿಶೇಷಣಕ್ಕಿಂತ ನಿಮ್ಮ ಅಭಿರುಚಿಯನ್ನು ಹೆಚ್ಚು ಸ್ಪಷ್ಟವಾಗಿ ತಿಳಿಸುತ್ತದೆ.
ಹಂತ 5: ನಿರ್ದಿಷ್ಟ, ಸಣ್ಣ ವಿನಂತಿಗಳ ಮೂಲಕ ಪುನರಾವರ್ತಿಸಿ
AIಗೆ ನೀಡುವ ಪ್ರತಿಕ್ರಿಯೆ ಕಿರಿಯ ವಿನ್ಯಾಸಕಾರರಿಗೆ ನೀಡುವ ಪ್ರತಿಕ್ರಿಯೆಯಂತೆಯೇ ಕೆಲಸ ಮಾಡುತ್ತದೆ: ನಿರ್ದಿಷ್ಟವಾಗಿ, ಒಂದೊಂದೇ ಭಾಗ, ಮತ್ತು ಯಾವುದನ್ನು ಉಳಿಸಬೇಕು ಎಂಬುದರಲ್ಲಿ ಸ್ಪಷ್ಟವಾಗಿ.
| ಅಸ್ಪಷ್ಟ | ನಿರ್ದಿಷ್ಟ |
|---|---|
| "ಇನ್ನೂ ಚೆನ್ನಾಗಿ ಮಾಡು." | "ವಿಭಾಗಗಳ ನಡುವಿನ ಅಂತರವನ್ನು 64 px ಗೆ ಹೆಚ್ಚಿಸಿ, ಪುಟ ಶೀರ್ಷಿಕೆಯನ್ನು 40 px ಮಾಡಿ, ಮತ್ತು ದ್ವಿತೀಯ ಪಠ್ಯವನ್ನು ಮಧ್ಯಮ ಬೂದಿಗೆ ಮೃದುಗೊಳಿಸಿ." |
| "ಗೊಂದಲಮಯವಾಗಿದೆ." | "ಅಂಕಿ-ಅಂಶಗಳ ಸಾಲಿನ ಕಾರ್ಡ್ ಗಡಿಗಳನ್ನು ತೆಗೆದುಹಾಕಿ, ಸಂಖ್ಯೆಗಳನ್ನು ಎಡಕ್ಕೆ ಜೋಡಿಸಿ, ಮತ್ತು ಲೇಬಲ್‌ಗಳನ್ನು ಸಣ್ಣ ಕ್ಯಾಪ್ಸ್‌ನಲ್ಲಿ ಮೇಲೆ ಇಡಿ." |
| "ಎದ್ದು ಕಾಣುವಂತೆ ಮಾಡು." | "ಉಚ್ಚಾರಣಾ ಬಣ್ಣವನ್ನು ಪ್ರಾಥಮಿಕ ಬಟನ್‌ಗೆ ಮಾತ್ರ ಬಳಸಿ. ದ್ವಿತೀಯ ಬಟನ್‌ಗಳನ್ನು ಔಟ್‌ಲೈನ್ ಮಾಡಿ." |
| "ಮೊಬೈಲ್ ನೋಟವನ್ನು ಸುಧಾರಿಸು." | "ಫೋನ್ ಅಗಲದಲ್ಲಿ, ಫಿಲ್ಟರ್‌ಗಳನ್ನು Filters ಬಟನ್‌ನಿಂದ ತೆರೆಯುವ ಶೀಟ್‌ನಲ್ಲಿ ಜೋಡಿಸಿ, ಮತ್ತು ಟೇಬಲ್ ಸಾಲುಗಳನ್ನು ಕಾರ್ಡ್‌ಗಳಾಗಿ ಮಾಡಿ." |
ಯಾವಾಗಲೂ ಉಳಿಸಬೇಕಾದದ್ದನ್ನೂ ಸೇರಿಸಿ — "ಎಲ್ಲಾ ರೂಟ್‌ಗಳು, ಪಠ್ಯ ಮತ್ತು ಫೀಚರ್‌ಗಳನ್ನು ಹಾಗೆಯೇ ಇಡಿ" ಎಂದು — ಇದರಿಂದ ದೃಶ್ಯ ಬದಲಾವಣೆಯು ಯಾವುದೇ ಕಾರ್ಯವನ್ನು ಗುಟ್ಟಾಗಿ ತೆಗೆದುಹಾಕುವುದಿಲ್ಲ. ಮುಂದಿನ ವಿನಂತಿಗೆ ಮುಂಚೆ ಪ್ರತಿ ಬದಲಾವಣೆಯನ್ನು ಫೋನ್ ಗಾತ್ರದ ಪರದೆಯಲ್ಲಿ ಪರಿಶೀಲಿಸಿ; ಸಣ್ಣ ಪರದೆಗಳಿಗೆ ಉತ್ತಮ ಕಾಣುವುದು ಹೇಗೆ ಎಂದು ತಿಳಿಯಲು ಮೊಬೈಲ್ ಸ್ನೇಹಿ ವೆಬ್ ಆಪ್ ನಿರ್ಮಿಸುವುದು ಹೇಗೆ ನೋಡಿ.
ಹಂತ 6: ಉತ್ತಮ ಮತ್ತು ಸಾಮಾನ್ಯದ ನಡುವಿನ ವಿವರಗಳು
ರಚನೆ ಸರಿಯಾದ ನಂತರ, ಈ ಸಣ್ಣ ವಿಷಯಗಳು ಆಪ್ ಪೂರ್ಣವಾಗಿ ಕಾಣುವಂತೆ ಮಾಡುತ್ತವೆ:
- ಖಾಲಿ ಸ್ಥಿತಿಗಳು. ಯಾವುದೇ ಡೇಟಾ ಇಲ್ಲದ ಹೊಸ ಬಳಕೆದಾರರು ಏನು ನೋಡುತ್ತಾರೆ: ಸಣ್ಣ ವಿವರಣೆ ಮತ್ತು ಒಂದು ಸ್ಪಷ್ಟ ಕ್ರಿಯೆ, ಖಾಲಿ ಟೇಬಲ್ ಅಲ್ಲ.
- ಲೋಡಿಂಗ್ ಸ್ಥಿತಿಗಳು. ವಿಷಯದ ಆಕಾರದಂತಹ ಸ್ಕೆಲಿಟನ್‌ಗಳು, ಎಲ್ಲೆಡೆ ಸ್ಪಿನ್ನರ್‌ಗಳಲ್ಲ.
- ದೋಷ ಸ್ಥಿತಿಗಳು. ಯಾವ ಕ್ಷೇತ್ರದಿಂದ ದೋಷ ಬಂತೋ ಅದರ ಪಕ್ಕದಲ್ಲಿ ಸರಳ ಭಾಷೆಯ ಸಂದೇಶಗಳು.
- ಹೋವರ್, ಫೋಕಸ್ ಮತ್ತು ಒತ್ತಿದ ಸ್ಥಿತಿಗಳು ಪ್ರತಿ ಸಂವಾದಾತ್ಮಕ ಅಂಶದ ಮೇಲೆ — ಕೀಬೋರ್ಡ್ ಬಳಕೆದಾರರಿಗೆ ಫೋಕಸ್ ರಿಂಗ್ ಮುಖ್ಯ.
- ನಿಜವಾದ ವಿಷಯ. "Lorem ipsum" ಮತ್ತು "John Doe" ಬದಲು ವಾಸ್ತವಿಕ ಪಠ್ಯ ಮತ್ತು ಡೇಟಾ ಬಳಸಿ; ನಕಲಿ ವಿಷಯ ಲೇಔಟ್ ಸಮಸ್ಯೆಗಳನ್ನು ಮರೆಮಾಡುತ್ತದೆ.
- ಒಂದೇ ಸೆಟ್‌ನಿಂದ ಐಕಾನ್‌ಗಳು, ಒಂದು ಅಥವಾ ಎರಡು ಗಾತ್ರಗಳಲ್ಲಿ, ಸ್ಥಿರ ಸ್ಟ್ರೋಕ್ ಅಗಲದೊಂದಿಗೆ.
- ಉದ್ದೇಶವಿರುವ ಚಿತ್ರಗಳು. ನಿಮ್ಮ ಉತ್ಪನ್ನ, ಸ್ಥಳ ಅಥವಾ ಜನರ ನಿಜವಾದ ಛಾಯಾಚಿತ್ರಗಳು ಸಾಮಾನ್ಯ ಸ್ಟಾಕ್ ಚಿತ್ರಗಳಿಗಿಂತ ಉತ್ತಮ. ಸ್ಟಾಕ್ ಅಥವಾ ರಚಿಸಿದ ಚಿತ್ರಗಳನ್ನು ಬಳಸಿದರೆ, ಸ್ಥಿರ ಶೈಲಿ ಇಟ್ಟುಕೊಳ್ಳಿ.
- ಪ್ರತಿ ಪಠ್ಯ. ಚಿಕ್ಕ, ನಿರ್ದಿಷ್ಟ ಲೇಬಲ್‌ಗಳು ("Submit" ಅಲ್ಲ, "Book class") ಯಾವುದೇ ಬಣ್ಣದ ಆಯ್ಕೆಯಷ್ಟೇ ಗುಣಮಟ್ಟದ ಭಾವನೆ ನೀಡುತ್ತವೆ.
ಸಾಮಾನ್ಯ ತಪ್ಪುಗಳು
- ಒಂದೇ ಪ್ರಾಂಪ್ಟ್‌ನಲ್ಲಿ ಎಲ್ಲವನ್ನೂ ಮರುವಿನ್ಯಾಸಗೊಳಿಸುವುದು. ದೊಡ್ಡ ಬದಲಾವಣೆಗಳು ಹಿಂಜರಿತಗಳನ್ನು ತರುತ್ತವೆ. ಪುಟ ಪುಟವಾಗಿ ಮುಂದುವರಿಯಿರಿ.
- ಹಲವು ಉಚ್ಚಾರಣಾ ಬಣ್ಣಗಳು. ಎಲ್ಲವೂ ಹೈಲೈಟ್ ಆದರೆ, ಏನೂ ಎದ್ದು ಕಾಣುವುದಿಲ್ಲ.
- ಎಲ್ಲವನ್ನೂ ಕೇಂದ್ರೀಕರಿಸುವುದು. ಶೀರ್ಷಿಕೆಯನ್ನು ಹೊರತುಪಡಿಸಿ ಕೇಂದ್ರೀಕೃತ ಪಠ್ಯ ಓದಲು ಕಷ್ಟ; ಹೆಚ್ಚಿನ ವಿಷಯವನ್ನು ಎಡಕ್ಕೆ ಜೋಡಿಸಿ.
- ಚಿಕ್ಕ, ಕಡಿಮೆ ಕಾಂಟ್ರಾಸ್ಟ್ ಪಠ್ಯ ದೊಡ್ಡ ಮಾನಿಟರ್‌ನಲ್ಲಿ ಸೊಗಸಾಗಿ ಕಾಣುತ್ತದೆ ಆದರೆ ಬಿಸಿಲಿನಲ್ಲಿ ಫೋನ್‌ನಲ್ಲಿ ಓದಲಾಗುವುದಿಲ್ಲ.
- ಶ್ರೇಣಿಗಿಂತ ಅಲಂಕಾರ. ಅತಿ ಮುಖ್ಯ ಕ್ರಿಯೆ ಸ್ಪಷ್ಟವಿಲ್ಲದ ಪರದೆಯನ್ನು ಗ್ರೇಡಿಯಂಟ್ ಮತ್ತು ನೆರಳುಗಳು ಸರಿಪಡಿಸಲಾರವು.
- ಲ್ಯಾಂಡಿಂಗ್ ಪುಟವನ್ನು ನಿರ್ಲಕ್ಷಿಸುವುದು. ಹಲವು ಉತ್ಪನ್ನಗಳಿಗೆ ಇದೇ ಮೊದಲ ಅನಿಸಿಕೆ; ಪರಿವರ್ತಿಸುವ ಲ್ಯಾಂಡಿಂಗ್ ಪುಟ ನಿರ್ಮಿಸುವುದು ಹೇಗೆ ನೋಡಿ.
ವಿನ್ಯಾಸದ ಆಚೆಗಿನ ಹೆಚ್ಚಿನ ಪ್ರಾಂಪ್ಟ್ ಮಾದರಿಗಳಿಗಾಗಿ, AI ಆಪ್ ಬಿಲ್ಡರ್‌ಗಳಿಗೆ ಪ್ರಾಂಪ್ಟ್ ಬರೆಯುವುದು ಹೇಗೆ ಓದಿ. ನಿಮ್ಮ ಕೆಲಸವೇ ಉತ್ಪನ್ನವಾಗಿದ್ದರೆ — ವಿನ್ಯಾಸ ಅಥವಾ ಛಾಯಾಗ್ರಹಣ ಪೋರ್ಟ್‌ಫೋಲಿಯೋ — ಪೋರ್ಟ್‌ಫೋಲಿಯೋ ವೆಬ್‌ಸೈಟ್ ನಿರ್ಮಿಸುವುದು ಹೇಗೆ ಪ್ರಸ್ತುತಿಯ ಬಗ್ಗೆ ಇನ್ನಷ್ಟು ವಿವರಿಸುತ್ತದೆ.
Mythex ನಲ್ಲಿ ವಿನ್ಯಾಸ
Mythex ನಲ್ಲಿ ನೀವು ಚಾಟ್‌ನಲ್ಲಿ ವಿನ್ಯಾಸವನ್ನು ವಿವರಿಸುತ್ತೀರಿ, ಲೈವ್ ಪ್ರಿವ್ಯೂನಲ್ಲಿ ನೋಡುತ್ತೀರಿ, ಮತ್ತು ಮುಂದಿನ ಬದಲಾವಣೆಯ ಮೊದಲು ಫೋನ್ ಗಾತ್ರದ ಫ್ರೇಮ್ ಪರಿಶೀಲಿಸುತ್ತೀರಿ. ಡಾಕ್ಸ್‌ನಲ್ಲಿ ಇದಕ್ಕಾಗಿ ಸಣ್ಣ ಮಾದರಿಗಳಿವೆ: ವಿನ್ಯಾಸ ಮತ್ತು UI ಪ್ರಾಂಪ್ಟ್‌ಗಳು ಏನು ಬದಲಾಯಿಸಬೇಕು ಮತ್ತು ಏನು ಉಳಿಸಬೇಕು ಎಂದು ಹೆಸರಿಸುವ ಬಗ್ಗೆ, ಮತ್ತು ನಿಮ್ಮ UI ಅನ್ನು ಮರುವಿನ್ಯಾಸಗೊಳಿಸಿ ಫೀಚರ್‌ಗಳನ್ನು ಕಳೆದುಕೊಳ್ಳದೆ ಒಂದು ಪುಟವನ್ನು ಒಂದೊಂದಾಗಿ ರಿಫ್ರೆಶ್ ಮಾಡುವ ಬಗ್ಗೆ. Mythex ಚಾಟ್‌ನಲ್ಲಿ ಸ್ಟಾಕ್ ಫೋಟೋಗಳನ್ನು ಹುಡುಕಬಹುದು ಅಥವಾ ಚಿತ್ರವನ್ನು ರಚಿಸಬಹುದು — ಹೀರೋ ಚಿತ್ರ, ಹಿನ್ನೆಲೆ, ಹಂಚಿಕೆ ಚಿತ್ರ — ಮತ್ತು ನೀವು ಕೇಳಿದಾಗ ಆಪ್‌ನಲ್ಲಿ ಇಡಬಹುದು. ಒಂದು ಹಂತ ತಪ್ಪಾದರೆ, ಅದಕ್ಕೆ ಮುಂಚಿನ ಚೆಕ್‌ಪಾಯಿಂಟ್‌ಗೆ ಹಿಂತಿರುಗಿ. ನಿಮಗೆ ಈಗಾಗಲೇ ಇರುವ ವಿನ್ಯಾಸದಿಂದ ಪ್ರಾರಂಭಿಸಲು ಬಯಸಿದರೆ, ಟೆಂಪ್ಲೇಟ್‌ಗಳನ್ನು ನೋಡಿ ಮತ್ತು ಹೊಂದಿಸಿ.
ಪ್ರಶ್ನೆಗಳು
AI ಮೂಲಕ ವಿನ್ಯಾಸಗೊಳಿಸಿದ ಆಪ್‌ಗಳೆಲ್ಲ ಒಂದೇ ರೀತಿ ಏಕೆ ಕಾಣುತ್ತವೆ?
ಅಸ್ಪಷ್ಟ ಪ್ರಾಂಪ್ಟ್‌ಗೆ ಅತ್ಯಂತ ಸರಾಸರಿ ಉತ್ತರ ಸಿಗುತ್ತದೆ: ಅದೇ ಫಾಂಟ್‌ಗಳು, ಗ್ರೇಡಿಯಂಟ್‌ಗಳು, ದುಂಡು ಮೂಲೆಯ ಕಾರ್ಡ್‌ಗಳು ಮತ್ತು ಮಧ್ಯದಲ್ಲಿ ಇರುವ ಹೀರೋ ವಿಭಾಗ. AIಗೆ ಉಲ್ಲೇಖಗಳು, ಹೆಸರಿಟ್ಟ ವಿನ್ಯಾಸ ದಿಕ್ಕು ಮತ್ತು ಅಕ್ಷರ, ಬಣ್ಣ ಹಾಗೂ ಅಂತರದ ಖಚಿತ ನಿಯಮಗಳನ್ನು ಕೊಟ್ಟರೆ, ಫಲಿತಾಂಶ ಸಾಮಾನ್ಯವಾಗಿ ಕಾಣುವುದಿಲ್ಲ.
ನಕಲು ಮಾಡಲು AIಗೆ ಸ್ಕ್ರೀನ್‌ಶಾಟ್ ತೋರಿಸಬಹುದೇ?
ಹಲವು AI ಬಿಲ್ಡರ್‌ಗಳು ಚಿತ್ರ ಲಗತ್ತುಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತವೆ, ಮತ್ತು ಶೈಲಿ ತೋರಿಸಲು ಸ್ಕ್ರೀನ್‌ಶಾಟ್ ಅತ್ಯಂತ ಸ್ಪಷ್ಟ ಮಾರ್ಗ. ಬೇರೊಬ್ಬರ ಉತ್ಪನ್ನವನ್ನು ಯಥಾವತ್ ನಕಲು ಮಾಡಲು ಕೇಳುವ ಬದಲು, ನಿಮಗೆ ಇಷ್ಟವಾದ ಅಂತರ, ಅಕ್ಷರ ಮತ್ತು ಬಣ್ಣ ಬಳಕೆಯನ್ನು ವಿವರಿಸಿ.
AI ಬಳಸಿ ನಿರ್ಮಿಸಿದರೆ ನನಗೆ ವಿನ್ಯಾಸಕಾರ ಬೇಕೇ?
ಮೊದಲ ಆವೃತ್ತಿಗೆ ಅಗತ್ಯವಿಲ್ಲ. ನೀವು ರಕ್ಷಿಸಬೇಕಾದ ಬ್ರ್ಯಾಂಡ್ ಇದ್ದಾಗ, ಅಥವಾ ಲೇಔಟ್ ನಿರ್ಧಾರಗಳು ಜನರ ಬಳಕೆಯ ಸುಲಭತೆಯ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರುವ ಸಂಕೀರ್ಣ ಉತ್ಪನ್ನವಿದ್ದಾಗ ವಿನ್ಯಾಸಕಾರರ ಸಹಾಯ ಹೆಚ್ಚು ಉಪಯುಕ್ತ. ಅಲ್ಲಿಯವರೆಗೆ, ಸ್ಪಷ್ಟ ಉಲ್ಲೇಖಗಳು ಮತ್ತು ಸಣ್ಣ ಹಂತದ ಸುಧಾರಣೆಗಳು ಸ್ವಚ್ಛ, ಬಳಸಬಹುದಾದ ಇಂಟರ್‌ಫೇಸ್ ನೀಡುತ್ತವೆ.
ಆಪ್ ವೃತ್ತಿಪರವಾಗಿ ಕಾಣಲು ಏನು ಬೇಕು?
ಅಲಂಕಾರಕ್ಕಿಂತ ಸ್ಥಿರತೆ ಮುಖ್ಯ: ಒಂದೇ ಅಕ್ಷರ ಮಾಪಕ, ಉದ್ದೇಶಪೂರ್ವಕವಾಗಿ ಬಳಸುವ ಸಣ್ಣ ಬಣ್ಣದ ಪ್ಯಾಲೆಟ್, ನಿಗದಿತ ಮಾಪಕದ ಮೇಲೆ ಅಂತರ, ಸರಿಯಾಗಿ ಜೋಡಿಸಿದ ಅಂಚುಗಳು, ಮತ್ತು ಪ್ರತಿ ಪರದೆಯಲ್ಲಿಯೂ ಅತಿ ಮುಖ್ಯ ಅಂಶ ಸ್ಪಷ್ಟವಾಗಿ ಕಾಣುವಂತೆ ಶ್ರೇಣೀಕರಣ.